Можно ли использовать функцию toDataUrl из элемента canvas с изображением googlePhotos? - PullRequest
Новая
       37

Можно ли использовать функцию toDataUrl из элемента canvas с изображением googlePhotos?

0 голосов
/ 09 апреля 2019

Мне нужно получить данные base64 из фотографий, размещенных в моем фотоальбоме Google.

Я получаю доступ к фотоальбому Google через API фотографий Google. Я выбираю фотографию (используя либо baseUrl, либо productUrl). Я "отправляю" эту фотографию на холст HTMLElement. Когда я использую функцию toDataUrl, я сталкиваюсь с проблемой, связанной с CORS: ОШИБКА DOMException: не удалось выполнить toDataURL для HTMLCanvasElement: испорченные полотна не могут быть экспортированы.

Я пытаюсь добавить свойство crossorigin в тег img, но результат не лучше ... crossorigin = "анонимный" не позволяет мне показывать мою фотографию ... crossorigin = 'use-credentials "имеет тот же результат, но в этом случае я не знаю, как определить учетные данные ... 

component.html : 
      <div *ngIf="photos" class="divPhotos">
      <img *ngFor="let photo of photos" class="photo" [src]="photo.baseUrl" height="200" [alt]="photo.filename" (click)="selectPhoto(photo)" [id]="photo.filename">
      <canvas id="canvas"></canvas>
      </div>

component.ts : 
        const  img = document.getElementById(photo.filename);
        const  canvas = document.getElementById('canvas');

        // @ts-ignore
        const ctx = canvas.getContext('2d');
        // @ts-ignore
        ctx.drawImage(img, 0, 0);
        // @ts-ignore
        dataURL = canvas.toDataURL();

Есть ли способ получить данные base64 из фотографии Google?

...