Блог

Главная - Вопросы по программированию - холст.toDataURL не работает на устройствах Android> 4 (но на Android 2)

холст.toDataURL не работает на устройствах Android> 4 (но на Android 2)

#android #cordova #canvas #ionic-framework #todataurl

#Android #кордова #холст #ionic-framework #todataurl

Вопрос:

Я создаю приложение с помощью Cordova / Ionic. Пользователь может управлять своими фотографиями из галереи, которые затем отображаются в приложении.

Проблема, с которой я сталкиваюсь прямо сейчас, заключается в том, что после манипуляций изображения не отображаются на устройствах Android> 4 (Android 4, Android 5, Android 6 и т. Д.). Видно только изображение «изображение не найдено». Но все работает, как и ожидалось, на устройствах Android 2.x.

Есть ли какие-либо существенные изменения между этими версиями?

Манипуляции выполняются с помощью этого плагина.

Мой код выглядит следующим образом (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");
      }

Ответ №1:

Хорошо, кажется, что на Android больше, чем 5 (5,6,7), существует необходимость security-policy в index.html header .

Просто добавьте следующее:

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

Это позволяет base64 отображать закодированные изображения.