[Support Guide] Troubleshooting your Netlify Large Media Configuration

Hey, thanks very much for your reply.

In gitattributes the paths are not /images, they are images:

images/uploads/** filter=lfs diff=lfs merge=lfs -text
images/uploads/* filter=lfs diff=lfs merge=lfs -text
*.jpg filter=lfs diff=lfs merge=lfs -text

git lfs ls-files lists the files but the netlify dynamic resizing isn’t working. e.g.

IS the full sized original image, not a netlify resized image which is my goal

Output of git lfs ls-files is below.

1bef71d374 - assets/img/uploads/screenshot-editor.jpg
872f07402f - images/pic01.jpg
49aae25ed7 - images/pic02.jpg
0d82c20904 - images/pic03.jpg
ee6aa87631 - images/pic04.jpg
d831ff7b20 - images/pic05.jpg
50349ee54c - images/pic06.jpg
01fdd2b0d8 - images/pic07.jpg
289c606a62 - images/pic08.jpg
9b6489e5aa - images/slide01.jpg
3c95a687b6 - images/slide02.jpg
a6d3bc0f1e - images/slide03.jpg
7a56655cf2 - images/uploads/acupuncture-model-back551x297.jpg
8602c913b0 - images/uploads/baby-in-towel-551x297.jpg
cb00f55eb2 - images/uploads/child-on-beach-with-spade551x297.jpg
f4b80f04a3 - images/uploads/children-smiling-551x297.jpg
58397ef4bb - images/uploads/chinese-parchment-551x297.jpg
a79ba2bcd5 - images/uploads/emotional-wellbeing-551x297.jpg
fa6beb4f1e - images/uploads/fertility-551x297.jpg
c4cdde5eb4 - images/uploads/hand-up-in-class551x297.jpg
ddf743e780 - images/uploads/hands-with-book-and-pen-551x297.jpg
43dd8b6116 - images/uploads/little-gang-1433289.jpg
4e5e7c7ffe - images/uploads/male-female-gender-symbols-drawn-in-chalk.jpg
a4bf0cd273 - images/uploads/middleaged-woman-chatting-sofa551x297.jpg
3cff8728a0 - images/uploads/moxa-rolls-551x297.jpg
17fcf283ff - images/uploads/open-book551x297.jpg
58c75d76e2 - images/uploads/pain-freedom-551x297.jpg
20b91234d0 - images/uploads/paper-family-in-hands551x297.jpg
6d6b8c9756 - images/uploads/physical-health-551x297.jpg
a8c5460c1e - images/uploads/pregnancy-birth-551x297.jpg
3d4f588c04 - images/uploads/senior-guy-2000x900.jpg
f632b8c4bf - images/uploads/shutterstock_103943927.jpg
b68efea62b - images/uploads/shutterstock_104963795.jpg
c3dd00e901 - images/uploads/shutterstock_105193541.jpg
37b83c5be2 - images/uploads/shutterstock_107645981.jpg
6986c5ebb6 - images/uploads/shutterstock_127297229.jpg
8530d40360 - images/uploads/shutterstock_66226753.jpg
bad333cbe0 - images/uploads/students-studying551x297.jpg
7852558ca6 - images/uploads/taking-pulse551x297.jpg
9b5782ba97 - images/uploads/teenagers-by-wall-551x297.jpg
46ab5b690b - images/uploads/three-smiling-people-2000x900.jpg
42bb3316b8 - images/uploads/womens-health-551x297.jpg

@tofuwarrior, everything looks good above. Would you please try running the following command?

git lfs push --all

Then check to see if those images are listed here after doing so:

https://app.netlify.com/sites/thirsty-lovelace-b58239/large-media

(Note: they are not listed there currently.)

If the command above doesn’t fix this, the would you please run the version below and save the output in a text file:

GIT_TRACE=1 GIT_CURL_VERBOSE=1 git lfs push --all

This is the same command with two Git specific environment variables which will trigger diagnostic output to be generated.

Please do not post that file here (it is probably okay, but I want to play it safe). If you would please reply here, we’ll open a support ticket to keep troubleshooting this.

Hi Luke,

really appreciate your help with this.

The commands didn’t quite work but if I added origin master they did.
Someting was uploaded but nothing showing in the LM area on the site which is puzzling.

I’ve pasted the output here:
G:\My Drive\Work\Development Work\ApacheWamp\www.clearspringacupuncture.co.uk\netlifyboilerplate>git lfs push --all
Specify a remote and a remote branch name (git lfs push origin master)

G:\My Drive\Work\Development Work\ApacheWamp\www.clearspringacupuncture.co.uk\netlifyboilerplate>git lfs push --all origin master
Remote “origin” does not support the LFS locking API. Consider disabling it with:
$ git config ‘lfs.https://[mycustomurldeleted].netlify.com/.netlify/large-media.locksverify’ false
Git LFS: (42 of 42 files) 52.68 MB / 52.68 MB

G:\My Drive\Work\Development Work\ApacheWamp\www.clearspringacupuncture.co.uk\netlifyboilerplate>GIT_TRACE=1 GIT_CURL_VERBOSE=1 git lfs push --all
‘GIT_TRACE’ is not recognized as an internal or external command,
operable program or batch file.

What is the next step?

thanks again,

Paul

Additionally , I found I coudn’t now pull, it says I have unmerged files.

I tried doing git push --force to get things together but that hadn’t resolved anything so after some fiddling around, I did git add .
and git push
and then stuff pushed so I checked the LM storage on etlify and the files were there.

Unfortunately, the nf_resize function still isn’t dynamically resizing the files in question.

e.g.
https://dev.clearspringacupuncture.co.uk/images/uploads/shutterstock_105193541.jpg?nf_resize=fit&w=551

which can be seen here:
https://dev.clearspringacupuncture.co.uk

CAn you advise what else I haven’t done?

`

Any ideas on this @luke?

For transparency, I wanted to update this thread with the resolution.

It turns out there were two issues:

  • the version of Git LFS being used was earlier than the required version here
  • because of this unsupported Git LFS version of the assets in our database/system were incorrectly uploaded

The solution was to update the version of Git LFS being used. Then additional work was done to remove the incorrect copies of those assets from our service. Once these two steps were completed one more git lfs push --all origin was needed and the issue was resolved.

This was a tricky issue to spot as there were two version of git being used. Note the logging above showed a valid version (Checking Git LFS version [2.8.0]). It turned out this version wasn’t being used by the local Git install when debugging output from git was examined.

At the end of the day, we did find the root cause, resolved the issue, and it is working correctly now. :slight_smile:

Hi Luke,

Everything looks good on my end from this troubleshooting page. I updated GIT, and ran git lfs push --all origin However I’m still getting a 401 error on my netlify lm page (the url that is in the .lfsconfig).

Any reason why this would be?

Git LFS is tracking the correct files and everything is working correct locally. The files are just not showing up on the netlify side.

Let me know! thanks!

Hi, @drew. I believe we are troubleshooting this privately in another channel. Once we have a resolution there, we’ll update this topic with the solution (minus any private or sensitive details, of course).

2 Likes

I cannot get this to work with a Middleman setup, just get constant JS errors:

TypeError: "t is undefined" is shown once the admin has loaded, then TypeError: g is undefined when trying to upload any images, both referenced from mediaLibrary.js (in Firefox). Safari is a bit less cryptic with error messages TypeError: undefined is not an object (evaluating 't.map') and Unhandled Promise Rejection: TypeError: undefined is not an object (evaluating 'g.find').

TypeError: Cannot read property 'map' of undefined
    at S (netlify-lfs-client.js:158)
    at Object.getResourceDownloadURLArgs (netlify-lfs-client.js:239)
    at implementation.js:374
    at /admin/async https:/unpkg.com/netlify-cms@2.9.7/dist/netlify-cms.js:234

netlify-cms-app 2.9.7
netlify-cms-core 2.12.2

  ✔ Checking Git version [2.23.0]
  ✔ Checking Git LFS version [2.8.0]
  ✔ Checking Git LFS filters
  ✔ Checking Netlify's Git Credentials version [0.1.8]

backend:
  name: git-gateway

media_folder: source/images/uploads
public_folder: images/uploads

collections:
  - name: blog
    label: Blog
    folder: source/posts/
    extension: .html.md
    format: frontmatter
    slug: '{{title}}'
    create: true
    fields:
      - {label: Title, name: title, widget: string, required: true}
      - {label: Publish Date, name: date, widget: datetime}
      - {label: Image, name: image, widget: image, required: false}
      - {label: Body, name: body, widget: markdown}

Anyone seen anything like this? Wasted a few hours on this now and can’t find a resolution. The site I’m trying to setup is https://mixlr-blog.netlify.com/admin/#/

Do you have subfolders within your media library folder maybe?

Only the uploads folder, which I’ve tried with/without.

The folder you use as a media folder source/images/uploads must exist and shouldn’t have any folders nested since having subfolders within your media library is not yet supported. Can you share your repo?

This ones private but I’ve set up a duplicate version from fresh with the same errors:

Problem is now I’m getting Large Media addon doesn't support the repo linked to multiple sites when trying to add it to this new repo using netlify lm:setup, even though it’s not linked to multiple sites :confused: Think it’s time to cut my losses with this.

There’s no upload folder within your images folder even though you specified it as your media library folder, causing at least some of these issues. Add the uploads folder to your images folder and try again :slight_smile:

Even adding the upload folder (which I had in the other repo) I still get those JS errors. I’m just going round in circles now, even deleted all those repos and tried setting up another private one from scratch, same thing.

Thanks for your help though :slight_smile: I can’t spend any more time trying to get this working.

@olliekav, if you do want to troubleshoot this further please let us know and we’ll be happy to do just that.

(@tomrutgers is awesome, by the way. Thank you for your help on this, Tom.)

@luke @tomrutgers So I grabbed another 30min looking at this, started from fresh again. Eventually I was able to get it working by adding a single image to the uploads folder, then pushing that. Is that something that is expected? I couldn’t see anything in the docs regarding that?

I guess the question that will let us answer your question is: what line did you add, and what exactly was the behavior change observed?

Hi there! Is this the megathread for troubleshooting with Netlify Large Media?

I have LFS all set up, but I can’t access my file from the site. This is file I’m trying to access:

http://affectionate-hodgkin-9a5dbe.netlify.com/media/attract/mary-church-terrell.mp4

It returns a JSON 404 object {"code":404,"msg":"File not found"} as opposed to the usual 404 HTML page.

In my app’s Large Media tab, it’s showing this file (and three others — all of which don’t work).

I can also share my repository, which is open. You can see the three files here, checked in with Git LFS: https://github.com/BadIdeaFactory/vision2020/tree/master/public/media/attract

And this is the output when I run lm:info:

➜  vision2020 git:(master) netlify lm:info
  ✔ Checking Git version [2.24.0]
  ✔ Checking Git LFS version [2.8.0]
  ✔ Checking Git LFS filters
  ✔ Checking Netlify's Git Credentials version [0.1.8]

Everything seems to be working! But the fact that I still can’t access these files must mean there’s something I’m not understanding about the way Large Media works.

If it makes any difference, I’m using Next.js as my build process. I do not need access to the files during the build. I only need them to be hosted, so that my site’s front end can access those files.

Thanks!

Hi, @louh, and welcome to our community site.

It is definitely okay posting here or you can create a new topic with your Netlify Large Media (NLM) question (in the future or if other people are reading this and want to ask NLM questions too). Both work great so do whichever you prefer.

As you stated, I also see the files as expected in the Large Media configuration page in the Netlify UI, but the URLs are not working when I test.

Would you please check that there is a file named .lfsconfig in the base of the git repo for this site?

It should contain something similar to this:

[lfs]
	url = https://8eab2635-9055-47af-95b2-0e81748a8a36.netlify.com/.netlify/large-media

Note, your URL should be different and the netlify.com subdomain should be the same as the API ID found here:

https://app.netlify.com/sites/affectionate-hodgkin-9a5dbe/settings/general#site-information

(The API ID is not sensitive and can be publicly shared without concern. The API keys are sensitive so please never share those, but site API IDs are safe to share publicly.)

If the .lfsconfig file is there (and it probably is), next please confirm that you have the actual binary file in your local repo (not the Git LFS pointers which are three lines of text). If you have the actual files locally in the repo, would you please try running the following command to force their “re-upload” to Netlify:

git lfs push --all origin

Then trigger a new deploy of the site and let us know the MP4 URLs are working after this is done.

If it still isn’t working, please run one more command (below) but do not post the results here in public. Please DM/PM me (@luke) the output of the command. I’ve made sure you can direct message but if you cannot for some reason, let us know here. The command we need the output for is the one below:

GIT_TRACE=true GIT_CURL_VERBOSE=true git lfs push --all origin

That is the debugging version of the first command and it will tell us more about what is happening if the first command doesn’t fix the issue.

It does resolve the issue in many (not all) cases and, if there are additional questions about this, please add them anytime.

1 Like