Chrome extension - Disable Blocking of Mixed Content [duplicate]

Question

So I'm building a Chrome extension that takes images from the current tabs and sends those images to a server to host the image. It works great for many sites, but on major sites like Instagram and Pinterest, it won't work because the browser blocks mixed content (HTTP and HTTPS). I get the following error message in the console:

 Mixed Content: The page at 'https://www.instagram.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint. This request has been blocked; the content must be served over HTTPS.

I checked this post and it doesn't appear to help me with regards to extensions spcifically: https://productforums.google.com/forum/#!topic/chrome/OrwppKWbKnc

Also, I tried to add the server URL to the permissions in manifest.json and that did nothing for me, either.

My question is this: is there a way for me to have a Chrome extension that allows mixed content for just my server or is my only option to switch my server over to HTTPS?

Answer 1

If you send http request from content scripts, since it lives in the same context with the webpage, it will be restricted by SOP, which is browser behavior.

You could move your http request from content scripts to background page (either by Message Passing or some other trigger like browser Action), since background page lives in the context of the extension, while extension itself can bypass the SOP by adding server URL to permissions.