We’re Still Here to Help (Even Over the Holidays!) - find out more here.
Forum Discussion
Solved
What link do I use to read a JPG with code?
I put a JPG on dropbox (in a subfolder) and I am trying to download that JPG using a javascript fetch command. My code works fine with JPGs hosted on various other servers including Google Drive.
My javascript code is using this link: https://www.dropbox.com/scl/fi/ea9go6nont63t556sy6o4/WA_Chiwaukum_big_open_topo.jpg?rlkey=m7girlv2c79sq98u0retjcs6e&dl=1
The purpose for downloading the JPG is so my code can use the cache API to save the JPG on the user's device. This is all part of the GeoJPG web app I developed for offline maps.
If I enter the above link into a browser tab then I am invited to download the JPG. However, when I try to download the JPG content with my javascript then the following error messages show up in the browser's console.
Failed to load ‘https://www.dropbox.com/scl/fi/ea9go6nont63t556sy6o4/WA_Chiwaukum_big_open_topo.jpg?rlkey=m7girlv2c79sq98u0retjcs6e&dl=1’. A ServiceWorker passed a promise to FetchEvent.respondWith() that rejected with ‘TypeError: NetworkError when attempting to fetch resource.’.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.dropbox.com/scl/fi/ea9go6nont63t556sy6o4/WA_Chiwaukum_big_open_topo.jpg?rlkey=m7girlv2c79sq98u0retjcs6e&dl=1. (Reason: CORS request did not succeed). Status code: (null).
What am I missing?
The www.dropbox.com website does not allow CORS requests, so attempting to access that from browser JavaScript will fail like that. There's also some information and options on these links here.
Alternatively, if you want to programmatically download content from a shared link in JavaScript, you can instead use the Dropbox JavaScript SDK. In particular, the sharingGetSharedLinkFile method allows an app to specify a shared link URL and get the linked file data back.
1 Reply
- Greg-DB
Dropbox Community Moderator
The www.dropbox.com website does not allow CORS requests, so attempting to access that from browser JavaScript will fail like that. There's also some information and options on these links here.
Alternatively, if you want to programmatically download content from a shared link in JavaScript, you can instead use the Dropbox JavaScript SDK. In particular, the sharingGetSharedLinkFile method allows an app to specify a shared link URL and get the linked file data back.
About Dropbox API Support & Feedback
Find help with the Dropbox API from other developers.
