0

I am building a website that will use chrome extension for some of its feature, I am using Next Auth and would like to authenticate from my extension whether or not the user is logged in/ has the next auth token.

I am currently getting the token from the cookies of my website "localhost" for now. And then sending it to content.js for whatever reason. and then sending the request to the next js backend with the token in the authorization header

// This is the content script

async function run() {
      const response = await chrome.runtime.sendMessage({ type: "REQ_COOKIE" })
      const cookies = response.cookies as chrome.cookies.Cookie[]
      console.log(cookies)

      if (response.cookies.length > 0) {
        const authCookie = cookies.find(
          (cookie) =>  == "__Secure-next-auth.session-token"
        ).value
        console.log(authCookie)
        const tokenString = `Bearer ${authCookie}`
        fetch("http://localhost:3000/api/auth", {
          headers: { Authorization: tokenString }
        })
      }
    }
    run()cookie.name

I currently have this going on my backend, with which all the origin can make request to this endpoint

// This is the backend
import type { NextRequest } from "next/server";
import { NextResponse } from "next/server";
import { getToken } from "next-auth/jwt";
import { env } from "@/env";
import { cookies } from "next/headers";

export async function OPTIONS(req: NextRequest) {
  return new NextResponse("", {
    headers: {
      "Access-Control-Allow-Origin": "*", // replace "*" with your actual origin
      "Access-Control-Allow-Credentials": "true",
      "Access-Control-Allow-Methods": "GET",
      "Access-Control-Allow-Headers": "Authorization",
    },
  });
}

export async function GET(req: NextRequest) {
  console.log(req.headers.get("Authorization"));
  const token = await getToken({ req, secret: env.NEXTAUTH_SECRET });
  if (token) {
    console.log(token);
    return new NextResponse("Successfull yay", {
      headers: {
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Credentials": "true",
        "Access-Control-Allow-Methods": "GET",
        "Access-Control-Allow-Headers": "Authorization",
      },
    });
  } else {
    return new Response("Not verified", {
      status: 401,
      statusText: "Unauthorized",
      headers: {
        "Access-Control-Allow-Origin": "*", 
        "Access-Control-Allow-Credentials": "true",
        "Access-Control-Allow-Methods": "GET",
        "Access-Control-Allow-Headers": "Authorization",
      },
    });
  }
}

Is there a way for me to make it so that, only the request from the background script of chrome extension is allowed.

3
  • 1
    I haven't tried it myself, but a Chrome extension sends an origin header in it's requests like chrome-extension://abc123.../. You can use that origin header to your advantage in the backend and only allow (with Access-Control-Allow-Origin) requests that send that specific origin header. The large majority of major browsers will comply and not let arbitrary code set that header. It doesn't protect against scripting outside a browser of course, their are more intricate mechanisms to that such as analyzing the TLS signatures, but that's really a different question. Commented May 28, 2024 at 12:58
  • Thanks for you response. I did that already and it worked. But can you explain me what TLS signatures are ? Commented May 30, 2024 at 5:22
  • It's a bit beyond my knowledge to be honest. My understanding of it is that the big players (Google, Netflix etc.) are able to determine in some way the libraries or method used to make a TLS handshake (ie, connect to HTTPS sites). The implication is that if you send a user agent, suggesting that a request is coming from Chrome, they can fingerprint you at the TLS level and determine that you were in fact using Node for example. This is just an anecdote, and I'm not 100% sure it's correct or accurate, but if you want more information about that, it's a probably a different question. Commented Jun 3, 2024 at 13:49

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.