tada123 commented 6 months ago

Bug Report

Problem

What is expected to happen?

Should accept (or at least have an option) to support non-ssl requests.

What does actually happen?

Chromium (inspected WebView) error message: Mixed Content: The page at 'https://localhost/index.html' was loaded over HTTPS, but requested an insecure image 'http://192.168.100.20/img.jpg'. This request has been blocked; the content must be served over HTTPS

Information

Cordova 11
Added: <meta http-equiv="Content-Security-Policy" content="default-src * gap: ws:; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; object-src 'none'; style-src 'self' 'unsafe-inline' *"/> to head section of index.html

Added <preference name="MixedContentMode" value="allow" /> to config.xml
But still unable to send non https request (or load an image from http://)

Command or Code

<img src="http://192.168.100.xx/image.jpg"></img> OR fetch("http://192.168.100.20/img.jpg")

Environment, Platform, Device

Moto G5 potter (Android 8.0 aarch64)

Version information

Checklist

[x] I searched for existing GitHub issues
[N - Last version does not support android 6.0, but i need to support also 6.0] I updated all Cordova tooling to most recent version
[x] I included all the necessary information above

breautek commented 6 months ago

The error is standard browser behaviour, which disallows mixed content. In otherwords, if you're on a secure origin, then you can't request non-secure resources.

Natively there is a way to disable/allow mixed content, but Cordova doesn't expose it this option. Cordova doesn't have a MixedContentMode preference (I believe that is an ionic webview thing specifically). Though I'd have no objection to have this preference added (PR is welcomed!)

You may be able to workaround this issue by using http:// scheme instead.

<widget ...>
  ...
  <platform name="android">
    <preference name="scheme" value="http" />
  </platform>
</widget>

This should put your webview origin at http://localhost and it will be considered an insecure context, allowing you to fetch resources from other insecure origins, but will have the caveat of disabling other web features.

Note that other browser security features will still apply including:

CORS
CSP (which you seem to be already handling)
Cordova's Allow List

Let me know if this helps.