I am using html2canvas and FileSaver.js for creating and downloading snap of HTML element in a VF page.
First I am converting a targeted HTML element into canvas using html2canvas and then converting canvas to blob[Type=Image] and downloading blob as an image using FileSaver.js.
This works very fine when VF page loads in Salesforce Classic mode. But in Salesforce Lightning mode it gives following errors.
Error:
In Google Chrome (Version 65):
Refused to frame '' because it violates the following Content Security Policy directive: "frame-src https: mailto: *.ap5.visual.force.com".
Not allowed to load local resource: blob:https://dfoc-ys-dev-02-dev-ed--c.ap5.visual.force.com/5e52d766-9394-453e-8137-283f5fa951a8
In Mozilla Firefox (Version 53 to 59)
Content Security Policy: The page’s settings blocked the loading of a resource at blob:https://dfoc-ys-dev-02-dev-ed--c.ap5.visual.force.com/3736dbbd-4dfe-4af7-ad0d-a3a62bb2070c (“frame-src”).
From the errors, It looks like CSP enforced by Salesforce in Lightning mode not allowing blob inside iframe.
Any suggestions or workaround will be appreciated.