Dropbox to Large Media (LFS) integration

Hi guys!

netlify site name: don’t have one yet

I’m planning to implement following workflow for my team:

  1. We (a wedding agency) receive GBs of photos from photographers into our Dropbox.
  2. An editor (not a developer or techie) logs into our CMS, which uses Dropbox Chooser to select photo(s) directly from Dropbox to show e.g. on a blog post.
  3. Latest upon saving the blog post, the photos are somehow “copied” / pushed from Dropbox to Netlify Large Media / LFS
  4. The changes (new blog post) are available to preview in a staging environment under a fixed domain / URL, or the preview URL can be is sent to the editor.

The Dropbox Chooser in step 2. is a JS widget that returns a piece of JSON with (temporary!) URL(s) to the selected photo(s), which can be up to 20MB each!

How can I implement the 3. step? Will I need to run some proxy API in the cloud which downloads the photos from Dropbox URLs to my VPS’s disk and then executes git add ... commit ... push, which then triggers static website build on Netlify and makes it available for the editors to preview their work?

This seems too cumbersome! Is there maybe a Netlify API / GitHub LFS to directly “download” large files from the public Dropbox URL to Netlify / GitHub LFS or similar, and then triggers site build …which I can use directly in the frontend of my CMS, without running some proxy API / cron job etc.?

In essence our challenge is: how can we use photos from Dropbox with Netlify Large Media without hindering the workflow of my editors, who don’t use VS Code / git and don’t have fiber optic internet to download and re-upload 100s of MBs of photos on daily basis.

Any ideas are welcome!

Thank you,

I don’t think so. However, Dropbox can produce static permanent links. If you choose to share a file and copy its sharing URL, replace dl=0 with raw=1 in the URL, you can directly link to the files in CMS. No need to copy them over to Netlify/GitHub.

The address could look like this: https://dropbox.com/file-to-share.jpg/?raw=1. It’s still manual work, but maybe your people won’t have to download/upload those files and no complicated code to work with. Just use Markdown image format: ![Alt text](https://path-to-file.jpg).

Definitely not a elegant solution, but it might work. Maybe Dropbox has an API to automatically generate sharing URLs.

I thought about this idea too. As you mention, it is manual work and is not user friendly. I could indeed use Dropbox API to generate these links, but still. Also if we use such “raw” links, some of our photos are 15MB+ and we could use 5-10 of them per page. So even if they will be compressed / resized when published to Prod, creating content will be still very slow.

Sadly, there’s no better way. It’s either that or nothing. There are currently no integrations of GitHub/Netlify LFS with cloud storages.