What's your biggest current challenge? Have your say in Community Polls along the right column.
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

How to set file path url in stagedUploadsCreate

Solved

How to set file path url in stagedUploadsCreate

AL33
Shopify Partner
43 0 3

Hello,

I am shopify newer, I don't unstand how to set the local machine url using stagedUploadsCreate,

how to upload local pdf file correctly. Please tell me, thank you!

 

AL33_0-1703146076359.png

The returned URL is wrong??? Maybe I missed the import step before using stagedUploadsCreate, please tell me what is it, thank you.

 

AL33_1-1703146113908.png

 

Accepted Solution (1)

RyanTechLLC
Shopify Partner
11 2 14

This is an accepted solution.

Since you said you want to upload a PDF, I'm assuming you want to upload files to the Shopify Admin in the files section, instead of uploading an image or file to be added to a product page. Uploading a file to the Shopify Admin is a poorly documented and painful 3-step process. I recently figured it out myself and will gladly break it down for you. BTW you might not be able to pull this off using postman- I'm not sure how long the upload URLs last.

First: Prepare the file. Since you are attempting to use postman, you just need the file to be on your local machine or uploaded to postman. Normally you would download the file to your node app server and read it with the fs package.

1. Call the stagedUploadsCreate mutation. You do not feed the image through in this step, all you are doing is telling Shopify to give you a temporary upload URL for your file. You will need both the url and resourceUrl, as well as the parameters that it returns.

2. Post your file to the returned url (not the resourceUrl) with the returned parameters using FormData. The file is added to the formData.

3. Call the fileCreate mutation, using the resourceUrl

You can successfully upload any file type using this method, you just have to change your file name extensions, mime type, and contentType. Here is a much more in-depth explanation that helped me with a full code snippet for NodeJs to get you up and running in no time: Full process for uploading files to the Files API - Shopify Community

If you don't use NodeJs, try copy/pasting the code from that post into your favorite AI tool and ask it to convert it. Hope this helps!

View solution in original post

Replies 12 (12)

Liam
Community Manager
3108 344 895

Hi AL33,

 

Just to confirm - are you uploading a PDF or a PNG file?

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

AL33
Shopify Partner
43 0 3

Yes. I am using postman to test uploading local pdf to shopify.

Liam
Community Manager
3108 344 895

I believe you can only upload image files and other supported file types with the stagedUploadsCreate mutation (see supported media types here) - but not PDFs. Can you try with a .png file to test that your mutation works for a file on the supported list?

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

RyanTechLLC
Shopify Partner
11 2 14

This is an accepted solution.

Since you said you want to upload a PDF, I'm assuming you want to upload files to the Shopify Admin in the files section, instead of uploading an image or file to be added to a product page. Uploading a file to the Shopify Admin is a poorly documented and painful 3-step process. I recently figured it out myself and will gladly break it down for you. BTW you might not be able to pull this off using postman- I'm not sure how long the upload URLs last.

First: Prepare the file. Since you are attempting to use postman, you just need the file to be on your local machine or uploaded to postman. Normally you would download the file to your node app server and read it with the fs package.

1. Call the stagedUploadsCreate mutation. You do not feed the image through in this step, all you are doing is telling Shopify to give you a temporary upload URL for your file. You will need both the url and resourceUrl, as well as the parameters that it returns.

2. Post your file to the returned url (not the resourceUrl) with the returned parameters using FormData. The file is added to the formData.

3. Call the fileCreate mutation, using the resourceUrl

You can successfully upload any file type using this method, you just have to change your file name extensions, mime type, and contentType. Here is a much more in-depth explanation that helped me with a full code snippet for NodeJs to get you up and running in no time: Full process for uploading files to the Files API - Shopify Community

If you don't use NodeJs, try copy/pasting the code from that post into your favorite AI tool and ask it to convert it. Hope this helps!

mohitpatel
Shopify Partner
15 0 0

hello AL33  I got some error so can find any solution. so please tell me.

AL33
Shopify Partner
43 0 3

I have fixed this problem, thank you.

mohitpatel
Shopify Partner
15 0 0

How can you solve this?

mohitpatel
Shopify Partner
15 0 0

please tell me how you can solve this error. I need to urgent. I will share my code. In my code when I file upload then upload step not show processing and ready steps. when I am file upload then showing error "file upload failed"

mohitpatel
Shopify Partner
15 0 0

I need this code Shopify remix. I think the above code is node js related but I want the above code in the remix app using Shopify. so please tell me if any one idea then tell me.

AL33
Shopify Partner
43 0 3

I did it work in postman after selecting the file

mohitpatel
Shopify Partner
15 0 0

can you share your code.? I need to upload a file using remix.

AL33
Shopify Partner
43 0 3

how to contact?