Chrome Extension socket communication with external script

Question

I will try to make this as short as possible. I have been struggling for the past 6 hours trying to find a way to make a Chrome Extension communicate with a Node.js script on my machine. I first attempted to use socket.io, but after a few hours of experimenting and trying it out, I found it that you cannot use require on a Chrome Extension. My second attempt was to use chrome.sockets, and after some research, I found out that you cannot use chrome.sockets either. I am currently lost and have no idea what to do in order to achieve a communication between the two.

What I want is for the script on my machine to be the server, and the Chrome Extension to be the client. The client will not be receiving any requests, just sending, and the server of course will only be receiving requests.

This is what I have so far:

Server:

var app = require('http').createServer(handler).listen(3690);
var io = sockets(app)

function handler(req,res){
    console.log(req.url);
    res.writeHead(200, {'Content-Type':'text/plain'});
    res.end('Hello Node\n You are really really awesome!');
}

io.sockets.on('connection',function(socket){
    console.log("Hola")
    
    socket.on("statusUpdate", (data) => {
        console.log(data);
    });
});

Client (what I kind of need it to do):

var socket = io('http://localhost:3690');
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log("Received");
    if (request[0] == "updateStatus") {
        console.log(request[1])
        socket.send(request[1])
    }
});

At this point, I have no idea what I can do in order to have the two communicate. Maybe the fact that the server will not be sending any requests to the client will help, but I still have no idea what I can do to solve this problem. If someone could help me and lead me towards the right direction, that would be amazing. Thank you for your time and help.

Answer 1

I found the solution thanks to @JakeHolzinger. In short, I must make the package (or just take the one already created) a single script, in which I then have to import into the manifest.json. It is IMPORTANT that it is called BEFORE the background.js script as it will not import it otherwise. The manifest.json looks something like:

"background": {
    "scripts": ["socket.io.js", "background.js"]
}

From there, I can use the socket.io library freely and it will not be affected by the CORS policy if you are communicating with the client (localhost). The script now looks like this:

var socket = io('http://localhost:3690');
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log("Received");
    if (request[0] == "updateStatus") {
        console.log(request[1])
        socket.send({"Title": Title, "Author": Author, "Album": Album})
    }
});

Very big thanks to @JakeHolzinger for helping me figure this out.