Send session cookies using a Chrome extension

I recently needed to send an AJAX request to a secure web service (a Node.js + Express service using Passport in particular) from within a Chrome extension and was hitting an issue with the web server not getting sent the session cookies for the domain. Here is how I solved it:

First, in your manifest.json, you need to declare your permissions properly for both cookies and the domain you’re requesting from:

{
  "name": "My Extension",
  "description": "...",
  "content_scripts": [
    {
      "matches": [ "<all_urls>" ],
      "js": [ "foreground.js" ]
    }
  ],
  "permissions": [
    "cookies",
    "https://mydomain.com/"
  ],
  "manifest_version": 2
}

Now in your content script (here, foreground.js), you need to send along the cookie with the request. I am using whatwg-fetch which is a HTML5 fetch polyfill library:

fetch('https://mydomain.com/api/users', {
  credentials: 'include',
})
  .then((data) => data.json())
  .then((data) => console.log('data', data))

The include part tells Chrome that you want to send a CORS request to the server which sends along the cookies properly.

Now you should be able to send requests to a secure webservice with your Chrome extension. This is particularly useful if you have an extension that needs to only work when a user is authorized and logged in.

← Read all articles