Ionic Cordova FileUpload 錯誤：不允許加載本地資源

Question

我是 Ionic 的新手，我正在嘗試上傳從存儲在 Android 文件系統中的相機拍攝的圖像：

var ft = new FileTransfer();
console.log('Uploading: ' + fileURL);
ft.upload(fileURL,
  encodeURI("http://192.168.192.62:3000/api/meals/picture"),
  pictureUploaded,
  function(error) {
    console.err(error);
    $ionicLoading.show({template: 'Ooops error uploading picture...'});
    setTimeout(function(){$ionicLoading.hide();}, 3000);
  },
  options);
  
var pictureUploaded = function() {
  console.log('uploaded!');
  $ionicLoading.hide();
};

fileUrl 指向現有圖像：file:///data/data/com.ionicframework.nutrilifemobile664547/files/Q2AtO1462636767466.jpg

在 chrome://inspect/#devices 控制台中，我收到以下錯誤，看起來由於錯誤，FileOptions 也沒有正確發送，這是錯誤（不允許加載本地資源）：

科爾多瓦版本：6.1.1
離子版本：1.7.14

Answer 1

當您對 Ionic 使用“livereload”選項時會發生這種情況。

嘗試在正常模式下運行

Answer 2

另一個可能的原因是您安裝了 webview 插件（如https://github.com/ionic-team/cordova-plugin-ionic-webview或只是https://github.com/apache/cordova-plugin-wkwebview-發動機）。 此外，這也不允許使用cdvfile://協議。

Answer 3

對於 ionic webview >3.x，你必須使用 convertFileSrc() 方法。 例如，如果您有一個 myURL 局部變量，例如 file:// 或 /storage。

let win: any = window; // hack ionic/angular compilator
var myURL = win.Ionic.WebView.convertFileSrc(myURL);

Answer 4

可能為時已晚，但是...您可以使用 File 將本機路徑轉換為 ​​blob，然后使用 URL.createObjectURL(blob) 將 blob 轉換為 URL，並將作為 src 傳遞/設置為您的 html 元素。 這對於生產環境是不必要的，但您可以使用 -lc 將其用於開發。 它可能工作

Answer 5

2018 年 12 月 7 日

這是它在 Ionic 3.9.2應用程序上對我3.9.2的版本。

刪除最新版本的webview ，然后：

即ionic cordova plugin add cordova-plugin-ionic-webview@1.2.1

https://github.com/ionic-team/cordova-plugin-ionic-webview/releases/tag/v1.2.1

注意：此版本與normalizeURL()方法一起工作正常。