Trying to run We3Auth.init() causes 404 error

[Legacy] GitHub Discussions
1

Hello there. I and my team have an issue with the current Web3Auth + OpenLogin SDK because it keeps failing whenever I try to run web3auth.init();

This is the App.js file:

import { Web3AuthCore } from “@web3auth/core”;
import { OpenloginAdapter } from “@web3auth/openlogin-adapter”;
import { WALLET_ADAPTERS, CHAIN_NAMESPACES } from “@web3auth/base”;

const web3auth = new Web3AuthCore({
clientId: “MY CLIENT ID”,
chainConfig: {
chainNamespace: CHAIN_NAMESPACES.EIP155,
chainId: “0x1”,
rpcTarget: “MY RPC NODE”,
}
});

const openloginAdapter = new OpenloginAdapter({}); //sso
web3auth.configureAdapter(openloginAdapter);

web3auth.init();

function App() {
return (
<div className=“App”>
<button
onClick={() =>
web3auth.connectTo(WALLET_ADAPTERS.OPENLOGIN, {
loginProvider: “google”,
})
}
>
Hey
</button>
</div>
);
}

export default App;

Everytime I try this, I get the following response from the broadcast server:

{
  "success": false,
  "message": "Invalid public key"
}

image

Package.json file

{
  "name": "testing-web3auth",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@web3auth/base": "^3.0.4",
    "@web3auth/modal": "^3.0.4",
    "@web3auth/openlogin-adapter": "^3.2.0",
    "@web3auth/web3auth-wagmi-connector": "^1.0.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4",
    "web3": "^1.8.1"
  },
  "scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@craco/craco": "^7.0.0",
    "assert": "^2.0.0",
    "buffer": "^6.0.3",
    "crypto-browserify": "^3.12.0",
    "https-browserify": "^1.0.0",
    "os-browserify": "^0.3.0",
    "process": "^0.11.10",
    "react-app-rewired": "^2.2.1",
    "stream-browserify": "^3.0.0",
    "stream-http": "^3.2.0",
    "url": "^0.11.0"
  }
}

craco.config.js

const webpack = require(“webpack”);

module.exports = {
webpack: {
configure: function (config) {
const fallback = config.resolve.fallback || {};
Object.assign(fallback, {
crypto: require.resolve(“crypto-browserify”),
stream: require.resolve(“stream-browserify”),
assert: require.resolve(“assert”),
http: require.resolve(“stream-http”),
https: require.resolve(“https-browserify”),
os: require.resolve(“os-browserify”),
url: require.resolve(“url”),
});
config.resolve.fallback = fallback;
config.plugins = (config.plugins || []).concat([
new webpack.ProvidePlugin({
process: “process/browser”,
Buffer: [“buffer”, “Buffer”],
}),
]);
config.ignoreWarnings = [/Failed to parse source map/];
config.module.rules.push({
test: /.(js|mjs|jsx)$/,
enforce: “pre”,
loader: require.resolve(“source-map-loader”),
resolve: {
fullySpecified: false,
},
});
return config;
},
},
};

I have tried so many solutions, but they all seem to keep failing. What could be the possible cause?



Originally posted by: SmithVyne

Check the discussion at: https://github.com/orgs/Web3Auth/discussions/977