Question

SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

componentWillUnmount() {

    this.props.words.forEach(w =>
  w.letters.forEach(l => {
    const existing = this.imageCache.get(l.letterId);
    if (existing) return;
    const image = new Image();
    // image.crossOrigin = "Anonymous";

    image.src = this.props.letters.find(
      ll => ll.id === l.letterId
    ).imgThumbnailUrl;

    image.onload = () => {
      this.handleLetterFetched(l.letterId);
    };
    // localStorage.setItem( "chosenLetterImages", image );

    this.imageCache.set(l.letterId, { image, fetched: false });
  })
);
};

componenDidUpdate() {
this.canvases.forEach((canvas, wordIndex) => {
  const letterImages = this.props.words[wordIndex].letters.map(
    l => this.imageCache.get(l.letterId).image
  );
  const ctx = canvas.getContext("2d");
    letterImages.forEach((image, index) => {
      ctx.drawImage(
        image,
        -imageWidth / 2,
        -imageHeight,
        imageWidth,
        imageHeight
      );
    // let data = canvas.toDataURL("image/png");

    // this.props.framingNonFrameCanvasInPng(data);

}

每当我跑

        let data = canvas.toDataURL("image/png");

我在顶部收到错误。当我使用img.crossOrigin =＆＃39; Anonymous＆＃39 ;; 一个错误消失但另一个错误出现

image access from firebase database has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

我只是尝试将canvas转换为png图像，以便我可以在我的反应应用程序上在facebook上分享它。

非常感谢！

SecurityError：无法执行＆＃39; toDataURL＆＃39; on＆＃39; HTMLCanvasElement＆＃39;：可能无法导出受污染的画布

0 个答案: