Cordova In app browser App Transport Security

问题

I am trying to load content in an In App Browser from my local server ( using httpd plugin ). the web page is coming from a https, while the local server is loading of course a http.

I am testing on an Iphone x IOS 12. Using adobe Build

Tried:

<access origin='*' allows-arbitrary-loads-in-media='true' allows-arbitrary-loads-in-web-content='true' allows-local-networking='true' />

<edit-config target="NSAllowsArbitraryLoads" file="*-Info.plist" mode="merge">

<true />

</edit-config>

<plugin name="cordova-plugin-transport-security" source="npm" />

Error:

[blocked] The page at https://somewebpage was not allowed to run insecure content from http://127.0.0.1:8080/javascripts/somejsfile.js.

none of these worked. anyone have a suggestion?

回答1:

This is not an App transport security problem, its a mixed content policy violation. Solution:

For android: Disable mixed content policy by putting the following code inside the pluginInitialize method of your cordova plugin:

if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
            final WebSettings settings = ((WebView)this.webView.getView()).getSettings();
      settings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
        }

https://developer.android.com/reference/android/webkit/WebSettings.html#MIXED_CONTENT_ALWAYS_ALLOW)

Then include local cordova.js using:

<script src="cdvfile://localhost/assets/www/cordova.js"></script>

For ios: I submitted a PR to the file plugin which solves the mixed content problem on ios: apache/cordova-plugin-file#296 The fixed version is available at: https://github.com/guylando/cordova-plugin-file If you load a remote site https://example.com on the webview then it allows to access local files using the url: https://example.com/cdvfile/bundle/www/cordova.js instead of cdvfile://localhost/bundle/www/cordova.js And by this solves the mixed content problems

Include local cordova.js using:

<script src="/cdvfile/bundle/www/cordova.js"></script>

回答2:

Another solution for android that doesn't change the security settings of the browser, is to use "https://cdvfile/assets/www/cordova.js" instead of "cdvfile://localhost/assets/www/cordova.js", and add the following line to the remapUri method in FileUtils.java (in the cordova file plugin):

uri = Uri.parse(uri.toString().replace("https://cdvfile/", "cdvfile://localhost/"));

This will load the file as usual and not cause the webview to block the request.

See PR https://github.com/apache/cordova-plugin-file/pull/322

回答3:

add to config.xml :

<allow-navigation href="*" />
<access origin="*" />"
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

and add to index.html Content Security Policy

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; img-src * data: 'unsafe-inline'; connect-src * 'unsafe-inline'; frame-src *;">
<meta http-equiv="Content-Security-Policy" content="default-src * gap://ready file:; style-src 'self' 'unsafe-inline' *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *">

and don't forget to add this plugin cordova-plugin-whitelist to your project

来源：https://stackoverflow.com/questions/53014490/cordova-in-app-browser-app-transport-security

标签

ios

cordova

http

inappbrowser

app-transport-security