Canvas image is not able to fetch(with fetch url query), causing cross origin error on some images.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
03-17-2021
01:02 AM
Hi, I'm trying to get the image meta data like blob etc., using one of canvas images url via fetch request , (It happens only in chrome and safari, not in firefox)
like below
fetch('https://instructure.com/canvas-image-url').then(res.blob());
What happened is like, I'm getting Corss origin error like below on trying with some of images, on the other hand some images working properly.
Access to fetch at 'https://instructure-uploads.s3.amazonaws.com/account_xxxxxxxx/attachments/xxx/Dorothea%20Lange.jpg?response-content-disposition=attachmentxxxxxxxx' (redirected from 'https://xxxxx.instructure.com/files/12345/download?download_frd=1&verifier=1phLgv8yv6tJQRggzfHV0Jgb15TRVSj6pXFVwjjy') from origin 'https://xxxxxx.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Need your helps and hands asap guys.
