Solved

How to set file path url in stagedUploadsCreate

AL33
Shopify Partner
40 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
6 2 3

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 4 (4)

Liam
Shopify Staff
2731 294 746

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
40 0 3

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

Liam
Shopify Staff
2731 294 746

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
6 2 3

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!