bvelitchkine/linkedin-cookie-savior

A chrome extension that stores LinkedIn and BullHorn cookies locally and then sends requests with cookie values inside to a webhook.

Purpose

🧶 This is a Google Chrome Extension to send a linkedin users' cookies to a remote API.

Indeed, some managers need to have access to all the linkedin authentication cookies of their team. In our case, li_at and lang are the two cookies that we're interested in. In the end, we're aiming at saving them all in the same spreadsheet the manager will have access to.

In practice, team members will have this extension installed on their computers. The extension will trigger whenever a linkedin (resp. bullhorn) page loads to collect li_at and lang (resp. UlEncodedIdentity) cookies.

Once they've been collected in the user's browser, if they had not been previously stored in the storage of the extension or have changed since the last time they were stored, we send a request to a webhook.

Ultimately, that webhook will handle a json payload with cookie data inside to put in said spreadsheet.

This extension is a major time saver now that the manager does not have to disturb his teammates each time he needs their linkedin authentication cookies.

Why do we need a BullHorn cookie?

For identification! Indeed, since a lot of teammates use the extension on their respective browsers simultaneously, if we sent only li_at and lang cookie data, we wouldn't be able to know where the cookie stemed from. What we want to know in addition is to who the cookie data belongs. We find that info in the bullhorn UlEncodedIdentity cookie, formatted like so:

%7B%22identity%22%3A%7B%22username%22%3A%22bvelitchkine.walb%22%2C%22masterUserId%22%3A7027623%2C%22userId%22%3A21125%2C%22corporationId%22%3A16414%2C%22privateLabelId%22%3A24866%2C%22userTypeId%22%3A75292%2C%22userPrimaryDepartmentId%22%3A1000000%2C%22swimLaneId%22%3A22%2C%22dataCenterId%22%3A2%2C%22name%22%3A%22Bastien%20Velitchkine%22%2C%22firstName%22%3A%22Bastien%22%2C%22lastName%22%3A%22Velitchkine%22%2C%22email%22%3A%22contact%40walbpartners.com%22%2C%22locale%22%3A%22en-GB%22%2C%22corporationName%22%3A%22WALB%20Partners%22%2C%22allPrivateLabelIds%22%3A%5B24866%5D%2C%22isSReleaseULEnabled%22%3Afalse%2C%22isPasswordCaseSensitive%22%3Atrue%2C%22eStaffAgencyId%22%3A%22%22%2C%22userTypeName%22%3A%22WALB%20Partners%20Enterprise%20Admin%20User%22%2C%22departmentName%22%3A%22WALB%20Partners%22%7D%2C%22sessions%22%3A%5B%7B%22name%22%3A%22rest%22%2C%22value%22%3A%7B%22token%22%3A%228510535c-92e5-4969-8ba7-efd84b5934a1%22%2C%22endpoint%22%3A%22https%3A%2F%2Frest22.bullhornstaffing.com%2Frest-services%2F4gelc4%2F%22%7D%7D%2C%7B%22name%22%3A%22coldfusion%22%2C%22value%22%3A%7B%22token%22%3A%22%22%2C%22endpoint%22%3A%22https%3A%2F%2Fcls22.bullhornstaffing.com%22%7D%7D%2C%7B%22name%22%3A%22canvas%22%2C%22value%22%3A%7B%22token%22%3A%22%22%2C%22endpoint%22%3A%22https%3A%2F%2Fukbigateway.bullhorn.com%2Fcanvas%2Fcgi-bin%2Fcognosisapi.dll%22%7D%7D%2C%7B%22name%22%3A%22novo%22%2C%22value%22%3A%7B%22endpoint%22%3A%22https%3A%2F%2Fapp.bullhornstaffing.com%22%7D%7D%2C%7B%22name%22%3A%22documentEditor%22%2C%22value%22%3A%7B%22endpoint%22%3A%22https%3A%2F%2Fdocs-emea.bullhornstaffing.com%2Fdocument%2F%22%7D%7D%2C%7B%22name%22%3A%22ul%22%2C%22value%22%3A%7B%22endpoint%22%3A%22https%3A%2F%2Fukuniversal.bullhornstaffing.com%2Funiversal-login%22%7D%7D%5D%2C%22apps%22%3A%5B%7B%22name%22%3A%22novo%22%2C%22enabled%22%3Atrue%7D%5D%2C%22requestUrl%22%3A%22http%3A%2F%2Funiversal.bullhornstaffing.com%2Funiversal-login%22%2C%22redirectUrl%22%3A%22https%3A%2F%2Fapp.bullhornstaffing.com%22%7D

If you look carefully, you'll see the bullhorn user id inside. It's a safe way to identify users because we know that they all use bullhorn on a daily basis.

Code organization

Manifest

The manifest is a set of rules and instructions for the whole extension. It defines for instance which resources of the project ought to be accessible online 👇

{
    ...,
    "web_accessible_resources": [
        {
            "resources": ["components/*"],
            "matches": ["<all_urls>"]
        }
    ]
}

It also tells which Chrome Extension's APIs we're allowed to use for the scope of this project 👇

{
    ...,
     "permissions": ["storage", "activeTab", "scripting", "webRequest"],
     ...
}

Background.js

This file is the backend of the chrome extension. It encompasses the whole logic of the app.

To say it differently, it handles workflows and other actions from a rather high-level perspective.

👉 For instance, it coordinates interactions with Bullhorn's API even though the actual functions requesting the API are not coded inside.

Utils

This folder stores utility functions and variables to be later imported in the background of the app. For instance, there are all the functions that send requests to Bullhorn's API.

Popup

This folder contains the html and css files rendered when the user clicks on the extension icon in his toolbar. It's called a popup.

Installation

Pre-Requisites

You have a navigator like Google Chrome, Brave or any other browser based on Chrome.

Tutorial

1. Fork this repo on your github profile and clone it into your machine.

2. Navigate to the top of the utils/cookieLogic.js file and change the webhook to the one your company will be using:

...
const WEBHOOK = "http://127.0.0.1:5000/cookie"; // Replace with the correct webhook.
...

3. Do the exact same thing in the manifest.json of the extension in the host_permissions area:

    {
    ...,
    "host_permissions": [
        "https://*.linkedin.com/*",
        "https://app.bullhornstaffing.com/*",
        "http://127.0.0.1:5000/*" 👈
    ],
    ...
    }

Congrats! 🎉 You're ready to install the extension in ou browser!

Ackowledgements

Coded with grit 💪 by Bastien Velitchkine.