Hello! I’m having trouble with the custom JWT authentication. I’m currently trying to integrate web3auth with keycloak. I followed the points in the documentation but it does not seem to work.
-
SDK Version:
“@web3auth/base”: “^5.1.0”,
“@web3auth/metamask-adapter”: “^5.1.0”,
“@web3auth/no-modal”: “^5.1.0”,
“@web3auth/openlogin-adapter”: “^5.1.1” -
Platform:
macOS 13.2.1
Node 18.12.1
Vue ^3.2.38 -
Browser Console Screenshots:
It appears that when it tries to get the jwt verifier from loginConfig it does not find anything and I think this might be because loginConfig is not present in the request, but I don’t know why and am currently stuck here.
In case it helps, this is the request object:
const r = req as ValidatedJRPCRequest<Record<string, unknown>[]>;
1. clientId: "XXXXX"
2. loginConfig: {}
3. method: "openlogin_login"
4. origin: "http://localhost:5173"
5. params: [{…}]
6. pid: "XXXXX"
7. popupWindow: false
8. redirect: true
9. sessionId: "XXXXX"
10. user: ""
11. _sessionNamespace: undefined
Additionally, Typescript is yelling at me and telling me that loginConfig is not present in OpenloginAdapterOptions (maybe this helps somehow).
- Related to Custom Authentication? Please provide the following info too: (Optional)
- Verifier Name: web3-auth-verifier-test
- JWKS Endpoint: “https://lemur-4.cloud-iam.com/auth/realms/web3auth-keycloak-test-deployment/protocol/openid-connect/certs”
- Sample idToken(JWT) :
eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJJSE9oaXlFdnlVa1RKeGJ1ZzRReGFYLUltblhDd044Mnk1cUxtalRELURjIn0.eyJleHAiOjE2ODExMjA1NTIsImlhdCI6MTY4MTEyMDI1MiwiYXV0aF90aW1lIjoxNjgxMTIwMjUxLCJqdGkiOiJiYzY0NDY2ZC02NGVmLTQyM2MtYTY2Yi1kMGRmNTQ2NTgwMzAiLCJpc3MiOiJodHRwczovL2xlbXVyLTQuY2xvdWQtaWFtLmNvbS9hdXRoL3JlYWxtcy93ZWIzYXV0aC1rZXljbG9hay10ZXN0LWRlcGxveW1lbnQiLCJhdWQiOiJjbGllbnQxIiwic3ViIjoiMjQ4NGQzZGEtMjBhYS00NmE1LWE5NDctMjdiMDE5NGYyMzZlIiwidHlwIjoiSUQiLCJhenAiOiJjbGllbnQxIiwibm9uY2UiOiJkOWMzYmFmZS0wNTc3LTRlMWQtODAyYS1lNjQ3OGEzMzU2ZDgiLCJzZXNzaW9uX3N0YXRlIjoiMmI2YTUwNTItZjA5Yi00ZjQ0LTkwNTAtM2NiNWI5ODQxNWUyIiwiYXRfaGFzaCI6ImFycm9QbVJOSXZ4T0VPTllJVWU1bnciLCJhY3IiOiIxIiwic2lkIjoiMmI2YTUwNTItZjA5Yi00ZjQ0LTkwNTAtM2NiNWI5ODQxNWUyIiwiZW1haWxfdmVyaWZpZWQiOnRydWUsIm5hbWUiOiJ3ZWIzYXV0aC1rZXljbG9hay10ZXN0LWRlcGxveW1lbnQgQWRtaW5pc3RyYXRvciIsInByZWZlcnJlZF91c2VybmFtZSI6ImFkbWluIiwiZ2l2ZW5fbmFtZSI6IndlYjNhdXRoLWtleWNsb2FrLXRlc3QtZGVwbG95bWVudCIsImZhbWlseV9uYW1lIjoiQWRtaW5pc3RyYXRvciIsImVtYWlsIjoiYWRtaW5AZW1haWwuY29tIn0.D5kwg7WoVp2eJGTsV2C-FZrTMlfYLuEzYVVN-DO9YEdhVuJGclpysxENNsF2xnnktAev1dOtYIuyeKR9eccE1YI9D5uAFzZFCxjcmEhFb7nFjfGTJi-5Y1N4_yFVL4BJVhmy1J5AHqZT-BKn2AGtVGM75gm4Z9NKbENMl4xkVlzF6GTtNY3YykQE9wMA8d7AYZlBW0aVGTAK5NllEXJlctNNmyg02R_rjqBPQ0roNmVklOt5gptpkowYOHE-wm_JshCT231gmB7iEBXqKqKilzoAtOKuHbouRdXOA7glYYJhs3InGeghiOaosl-8yF-9F1GIzsv_3n4m9h4_htOhEA
Please provide the Web3Auth initialization and login code snippet below:
initialization:
async function init() {
const auth = new Web3AuthNoModal(web3AuthConfig);
const openloginAdapter = new OpenloginAdapter({
adapterSettings: {
uxMode: 'redirect',
},
loginSettings: {
mfaLevel: 'none',
redirectUrl: 'http://localhost:5173/auth/login',
},
loginConfig: {
jwt: {
verifier: 'web3-auth-verifier-test',
typeOfLogin: 'jwt',
clientId: 'client1',
domain:
'https://lemur-4.cloud-iam.com/auth/realms/web3auth-keycloak-test-deployment/protocol/openid-connect/auth',
},
},
});
const metamaskAdapter = new MetamaskAdapter({});
auth.configureAdapter(metamaskAdapter);
auth.configureAdapter(openloginAdapter);
StaticWrapper.web3Auth = auth;
await auth.init();
if (auth.provider) {
provider.value = auth.provider;
}
}
login:
provider.value = await StaticWrapper.web3Auth.connectTo(
WALLET_ADAPTERS.OPENLOGIN,
{
loginProvider: 'jwt',
extraLoginOptions: {
id_token: 'idToken', // in JWT Format
verifierIdField: 'sub', // same as your JWT Verifier ID
response_type: 'token', //! check if correct
redirectUrl: 'http://localhost:5173/auth/login',
},
}
);