«Не разрешено загружать локальный ресурс» для локального изображения с удаленной страницы в PhoneGap Build

Question

Я размещаю свои веб-страницы для приложения для создания phonegap. Я хотел бы использовать камеру, чтобы загрузить фотографию и показать предварительный просмотр изображения, в основном это сделать:

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

Поскольку мои страницы размещены я получаю эту ошибку:

Не разрешено для загрузки локального ресурса: файл: ///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 Build)

<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:///*" /> 

Как вы можете видеть, что я пробовал все настройки я могу думать, с чистящими в Интернете. Я пропустил что-то очевидное?

Заранее спасибо.

Answer 1

ОК, наконец, получилось обходное решение, которое должно преобразовать файл: /// 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()); 
      }); 
     } 

бы еще неплохо иметь правильный путь доступа к файлу: /// URIs, я могу видеть случаи, когда это не будет работать, но за то, что я делаю это не будет решена.

Answer 2

Что-то примечание для будущих пользователей, которые сталкиваются с этим, убедитесь, что вы не работаете в режиме «Live Reload» при тестировании такой функции. Live Reload приведет к тому же сообщению об ошибке, которое явно вводит в заблуждение. После сборки без живой перезагрузки все работало отлично для меня, используя файл:/OR cdv:/path.

Answer 3

Я недавно столкнулся с такой же проблемой. Похоже, что приложение cordova ios запускается на localhost: 8080 внутри, это основная причина, по которой он не позволяет загружать файлы из протокола «file: //».

легко исправить - "var workingPath = window.Ionic.normalizeURL (givenPath)";

Пожалуйста, прочитайте статью аэроионного о том, что - https://ionicframework.com/docs/wkwebview/