Use webpack-httpolyglot-server

[jhen0409]

This solves the problem of long-standing - Due to injectpage feature, we only use https webpack server in development mode, so you need to allow https connection in any case.

The solution of use webpack-httpolyglot-server

• Just use http on Window, Popup, Background
• The publicPath using // as prefix for injectpage bundle, which means it will select protocol of current injectpage. Only when you are in https page, you need to allow https connection.

[tommedema]

@jhen0409 this seems to be bugged because of this line:

https://github.com/jhen0409/react-chrome-extension-boilerplate/blob/master/chrome/extension/background/inject.js#L15

You are always requesting the HTTP version of the inject script, and therefore when loading a HTTPS site, the inject script will fail to load.

I tried to use a protocol relative url // but this doesn't seem to work with fetch.

[tommedema]

Similarly, on https pages inject.jade seems to load from the http protocol. Also, I'm getting this:

Mixed Content: The page at 'https://tweakers.net/' was loaded over HTTPS, but requested an insecure EventSource endpoint 'http://localhost:3000/__webpack_hmr'. This request has been blocked; the content must be served over HTTPS.

[jhen0409]

but requested an insecure EventSource endpoint 'http://localhost:3000/__webpack_hmr'. This request has been blocked; the content must be served over HTTPS.

This is a problem for embedded iframe in right-dock, it used TodoApp bundle and always requesting HTTP (because used // will incorrect use chrome-extension:// in Window/Popup), it should not works with hot reload in embedded iframe (inject bundle works), I'm looking for a better way to improve it.