How to sync web app authentication with chrome extension

[zaidbren]

Hello everyone, I have been working on a project that involves users signing up on my main web app. The web app is created using Nextjs 14 with the new app router support and I used the next-auth to make the user sign in. Now I want to sync the authentication state between my web app and the Chrome extension, so for example, the user can authenticate on the main web app and when the user clicks on the Chrome extension on a separate tab, I want to make sure that the chrome extension shows based on the authenticated routes. It should also be able to make requests to the backend just like we can do from the web app if there exist a session either on the client or server component.
How can I enable something like this, I tried finding tutorials online, but I have no help yet

Thank you :)

[zulfio]

I'm also facing this situation, you can use message passing between your web app and the extension.

your next auth route:

async function authorize() {
    const user = valdiateUser();
    if (!user) {
        return null;
    }

    const extensionID = '123456';
    chrome.runtime.sendMessage(extensionID, {
            name: "AUTHORIZE_EXTENSION",
            user: user
        },
        function (response) {}
    );

    return user;
}

your extension background script:

chrome.runtime.onMessageExternal.addListener(async function (request, sender, sendResponse) {
    if (request.name === 'AUTHORIZE_EXTENSION') {
        // do your extension stuff here, like updating the auth state
    }
});

[zaidbren]

@zulfio, I also thought about this solution, but the problem with this approach is that we can only send messages from frontend to our extension whenever the user clicks on the login or logout button in the web app itself, but if the user manually deletes the authentication cookie from the web app or clear the chace or cookie from their browser, the extension would never receive any message regarding that and always gonna be authenticated even though the web app is unauthenticated

[lucaszebre]

Hello , did you find a solution ?