Exporting Canvas with toDataURL on a file:/// element causes taint error even on local resource

Question

I have a local HTML page, which is loaded from harddrive (inside a Android WebView) with file:// protocol. (folder: WirelessBarcodeScanner/Custom Forms/bctest.html)

Loading in a with a local file:// (folder: WirelessBarcodeScanner/_temp/img_9857836593673.jpeg)

Then I export this img to a canvas, and try to do a toDataURL() on it. Causing a SecurityException with that "tainted canvas may not be exported".

How can I resolve this security issue? CORS origin should be same as both sources are the same (local harddrive).

Is there anything I can do with the _temp folder to tell that any resources here may be exported somehow?

Answer 1

By default the Android WebView doesn't allow cross-origin access. An image with a file:// URL is always cross origin so the WebView blocks the CORS request and the canvas gets tainted.

However it's possible to configure the WebView to allow cross-origin access to file:// URLs like this:

webView.getSettings().setAllowFileAccessFromFileURLs(true);