CODEWITHSUNDEEP
javascriptgoogle-chromeelectronmixed-content
Sjael
Sjael

Reputation: 31

Electron webview is blocking http images

I'm trying to load a url (http://twitch.tv/directory/following) to be displayed on a webview. It used to display perfectly mirroring what I saw in Google Chrome. Somewhere along the way, it's started blocking the images form the page and I've been getting the errors

Mixed Content: The page at 'https://www.twitch.tv/directory/following' was loaded over HTTPS, but requested an insecure image 'http://static-cdn.jtvnw.net/ttv-boxart/Music-138x190.jpg'. This request has been blocked; the content must be served over HTTPS.

for every image that attempted to load. I've inspected this in Chrome, and I get the same message but instead listed as a warning, as the images still went through. I've tried to disable the security settings in the BrowserWindow: 

function createWindow () {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 1200,
    height: 800,
    'title-bar-style': 'hidden',
    frame : false,
    webPreferences : {
      webSecurity: false,
      allowDisplayingInsecureContent: true
    }
  });

But to no avail, as it still blocks the images. Any ideas? Thanks.

Upvotes: 1

Views: 2565

Answers (1)

Shawn Rakowski
Shawn Rakowski

Reputation: 5714

Because the webview is run in another process outside of your BrowserWindow it has its own security as does not inherit from the BrowserWindow. If you want to disable it you need to add disablewebsecurity to your webview tag. It is referenced in the documentation here: http://electron.atom.io/docs/v0.36.8/api/web-view-tag/#disablewebsecurity

Here is what it should look like:

<webview src="http://twitch.tv/directory/following" disablewebsecurity></webview>

I was able to replicate the issue. When I added disablewebsecurity the errors turned into warnings as you experienced with Chrome.

Upvotes: 3

Related Questions