canvas.toDataURL 无法在 Android >4 台设备上工作（但在 Android 2 台设备上）

Question

我正在使用 Cordova/Ionic 构建应用程序。用户可以操作他的图库照片，然后这些照片会显示在应用程序上。

我现在面临的问题是，在操作之后，图像没有显示在 Android >4 设备上（Android 4，Android 5，Android 6 等）。只有 "image-not-found" 图像可见。但是在 Android 2.x 设备上一切都按预期工作。

这些版本之间有什么重大变化吗？

操作是用 this plugin 完成的。

我的代码如下所示 (index.html)

<img src="{{!!image.img11 ? image.img11.src : 'img/layout/placeholder.png'}}" ng-cloak>

App.js

      navigator.camera.getPicture(onSuccess, onFail,
      {
        quality: 30,
        destinationType: Camera.DestinationType.FILE_URI,
        sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
        targetWidth: imagePickerWidth,
        targetHeight: imagePickerHeight,
        encodingType: Camera.EncodingType.PNG,
        allowEdit: false
      });

      function onSuccess(imageURI) {
        self.crop(resolve, reject, scope, imageURI, type, width, height, tabs);

        /* JR-CROP MANIPULATION */

        scope.image.img11 = new Image();
        scope.image.img11.src = canvas.toDataURL("image/png");
      }

Answer 1

好吧，似乎在 Android 大于 5 (5,6,7) 的 index.html header 中需要一个 security-policy。

只需添加以下内容：

<head>
<meta http-equiv="Content-Security-Policy" content="img-src 'self' data:;">
...
</head>

这允许显示 base64 个编码图像。

canvas.toDataURL 无法在 Android >4 台设备上工作（但在 Android 2 台设备上）

canvas.toDataURL not working on Android >4 devices (but on Android 2)

android

canvas

cordova

todataurl

ionic-framework