“不允许加载本地资源”从PhoneGap中的远程页面的本地图像构建

我正在托管我的网页，用于phonegap构建应用程序。我想用相机上传照片，并显示预览图像，基本上是这样：“不允许加载本地资源”从PhoneGap中的远程页面的本地图像构建

<img src="file:///storage/emulated/0/Android/data/com.myapp.myapp/cache/1470418568917.jpg" height="500" />

因为我的网页托管我得到这个错误：

不允许加载本地资源：file：///storage/emulated/0/Android/data/com.myapp.myapp/cache/1470418568917.jpg“，来源：https://www.myapp.com/v5.5/imager.html#

我假设这是一些CORS问题，所以我已将此添加到页面的html中

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; media-src *; img-src * filesystem: data:">

，这对我的config.xml中（我用的PhoneGap构建）

<plugin name="cordova-plugin-whitelist" source="npm" /> 

<allow-navigation href="*" /> 
<allow-navigation href="*://*/*" /> 
<allow-navigation href="file:///*/*" /> 
<allow-navigation href="http://*/*" /> 
<allow-navigation href="https://*/*" /> 
<allow-navigation href="data:*" /> 

<allow-intent href="*" /> 
<allow-intent href="http://*/*" /> 
<allow-intent href="https://*/*" /> 
<allow-intent href="tel:*" /> 
<allow-intent href="sms:*" /> 
<allow-intent href="mailto:*" /> 
<allow-intent href="geo:*" /> 

<access origin="*" /> 
<access origin="*://*/*" /> 
<access origin="file:///*" /> 
<access origin="cdvfile://*" /> 
<access origin="content:///*" />

正如你可以看到我已经想尽设置我能想到的，从网上淘。我错过了一些明显的东西吗？

在此先感谢。

来源

2016-08-05 Nico Westerdale

顺便说一句，在双方的iOS出现错误和Android –

OK终于得到了一个解决方法，即将文件：/// URI转换为cdvfile：// URI，我的网页只会抱怨它是混合内容警告，并且允许我访问！

function getFileEntry(imgUri) { 
      window.resolveLocalFileSystemURL(imgUri, function success(fileEntry) { 
       console.log("got file: " + fileEntry.fullPath); 
       console.log('cdvfile URI: ' + fileEntry.toInternalURL()); 
       $('#imgPreview').attr("src", fileEntry.toInternalURL()); 
      }); 
     }

仍然会是不错的访问文件有道：/// URI的，我可以看到这是行不通的情况下，但对于我这样做有什么解决。

来源

2016-08-05 19:25:53

这需要此科尔多瓦插件https://github.com/apache/cordova-plugin-file –

这里有一些需要注意的地方，以防未来遇到此问题的用户遇到这种情况，请确保在测试此类功能时不会以'Live Reload'模式运行。 Live Reload会导致同样的错误信息，这显然会造成误导。在构建完w/o live reload之后，使用文件：/ OR cdv：/ path对我来说一切正常。

来源

2017-08-24 15:14:30

很高兴在这里看到这一点，只是细节是，它可能是对上述答案的评论......因为它不是这样的答案 –

我最近面临同样的问题。显示cordova ios应用程序在内部运行在localhost：8080上，这是它不允许从“file：//”协议加载文件的主要原因。

简单修复 - “var workingPath = window.Ionic.normalizeURL（givenPath）”;

请从离子阅读文章有关 - https://ionicframework.com/docs/wkwebview/

来源

2018-01-15 13:46:53

有趣的文章，不幸的是它只适用于离子3 –

它帮助我，虽然我使用离子1 –

最重要的是解释了发生这种情况的原因。以及如何解决它一般。 –

“不允许加载本地资源”从PhoneGap中的远程页面的本地图像构建

回答

相关问题