search

undecaf / barcode-detector-polyfill

A WebAssembly polyfill for the Barcode Detection API
MIT License
118 stars 14 forks source link

Chrome: Failed to execute 'getImageData' on 'OffscreenCanvasRenderingContext2D' #8

Closed stereobooster closed 1 year ago

stereobooster commented 1 year ago

I got this error in Chrome for image from remote server

Uncaught (in promise) DOMException: Failed to execute 'getImageData' on 'OffscreenCanvasRenderingContext2D': The canvas has been tainted by cross-origin data.
    at t2 (http://localhost:3000/node_modules/.vite/deps/@undecaf_barcode-detector-polyfill.js?v=0927827e:104:41)
undecaf commented 1 year ago

You might try <img crossorigin="anonymous"> in the markup (as in the example) or image.setAttribute('crossOrigin', 'anonymous') on the Image object before loading the image from the remote server.

This article presents a more in-depth explanation: https://inspirnathan.com/posts/105-fix-tainted-canvas-from-cross-origin-error/

stereobooster commented 1 year ago

Hey 👋

First of all thank you for this library.

I probably poorly worded bug report. The problem is that this promise rejection isn't handled. I would expect detect function to reject with this error. I can make a PR to fix (I didn't check code, but it should be easy to find)

undecaf commented 1 year ago

Ahh... I understand now what you meant, and I have fixed detect() to return a rejected Promise in error cases.