Hello Shopify Community!
I hope you all are doing well, Actually I’m facing some problem while uploading files to shopify store using admin api, like everything goes well but when it tries to posts on temporary target it just gets stuck even tried using a timeout but didn’t worked on that, would be really appreciated if someone helps
here’s my output:
Posting file to temporary target...
Appending param - name: Content-Type, value: image/png
Appending param - name: success_action_status, value: 201
Appending param - name: acl, value: private
Appending param - name: key, value: tmp/69646778567/files/847619ba-8daa-4ff8-b331-fc19358da247/example.png
Appending param - name: x-goog-date, value: 20250401T175605Z
Appending param - name: x-goog-credential, value: merchant-assets@shopify-tiers.iam.gserviceaccount.com/20250401/auto/storage/goog4_request
Appending param - name: x-goog-algorithm, value: GOOG4-RSA-SHA256
Appending param - name: x-goog-signature, value: a1653483b139902dbfcba663b8fd5f318ee607763c1c8cda15746c92d1dd4dfddac460d44a32cc0d3f1e82215b3947bb69ece792ad22f19a93f819fc94b96a749e5028312daa84af9957751196968ca19d7392a7590d3ac43dc36e98b63fa1ab5e4fe38ba42c462181c0e7608ae6598336777a751a4e048e094e60b06198629b982a7fd086ba2eb6092d7929286a850cf6d586c1e3d9e01b0f3c70a15a23b492b12426938551ecb675e473122f235708f0a3ac23b1465ce4213373c44e0623721fd288bc8aa379ee61d3e423400c8ff20234b3463e3993ae2f7a66a463adb4161fcae6c3ff925b5db87daf7d1bd0212aa75a4daf4bea52fd69fa9156f13e0f34
Appending param - name: policy, value: eyJjb25kaXRpb25zIjpbeyJDb250ZW50LVR5cGUiOiJpbWFnZVwvcG5nIn0seyJzdWNjZXNzX2FjdGlvbl9zdGF0dXMiOiIyMDEifSx7ImFjbCI6InByaXZhdGUifSxbImNvbnRlbnQtbGVuZ3RoLXJhbmdlIiwxLDIwOTcxNTIwXSx7ImJ1Y2tldCI6InNob3BpZnktc3RhZ2VkLXVwbG9hZHMifSx7ImtleSI6InRtcFwvNjk2NDY3Nzg1NjdcL2ZpbGVzXC84NDc2MTliYS04ZGFhLTRmZjgtYjMzMS1mYzE5MzU4ZGEyNDdcL2V4YW1wbGUucG5nIn0seyJ4LWdvb2ctZGF0ZSI6IjIwMjUwNDAxVDE3NTYwNVoifSx7IngtZ29vZy1jcmVkZW50aWFsIjoibWVyY2hhbnQtYXNzZXRzQHNob3BpZnktdGllcnMuaWFtLmdzZXJ2aWNlYWNjb3VudC5jb21cLzIwMjUwNDAxXC9hdXRvXC9zdG9yYWdlXC9nb29nNF9yZXF1ZXN0In0seyJ4LWdvb2ctYWxnb3JpdGhtIjoiR09PRzQtUlNBLVNIQTI1NiJ9XSwiZXhwaXJhdGlvbiI6IjIwMjUtMDQtMDJUMTc6NTY6MDVaIn0=
Form Headers: {
'content-type': 'multipart/form-data; boundary=--------------------------386629209347580842224432'
}
Uploading file to AWS S3 via URL: https://shopify-staged-uploads.storage.googleapis.com/
and Here’s my code:
const axios = require("axios");
const fs = require("fs");
const FormData = require("form-data");
const your_shopify_admin_url = "";
const your_shopify_admin_token = "";
async function uploadFile() {
try {
console.log("Starting file upload...");
// Read the file
console.log("Reading the file...");
const file = await fs.promises.readFile("./banner1.png"); // Using fs.promises.readFile
console.log("File read successfully.");
const fileSize = fs.statSync("./banner1.png").size; // Important to get the file size for future steps.
console.log("File size:", fileSize);
// Create staged upload
console.log("Creating staged upload...");
const stagedUploadsQuery = `
mutation stagedUploadsCreate($input: [StagedUploadInput!]!) {
stagedUploadsCreate(input: $input) {
stagedTargets {
resourceUrl
url
parameters {
name
value
}
}
userErrors {
field
message
}
}
}
`;
const stagedUploadsVariables = {
input: {
filename: "example.png",
httpMethod: "POST",
mimeType: "image/png",
resource: "FILE", // Important to set this as FILE and not IMAGE.
},
};
const stagedUploadsQueryResult = await axios.post(
`${your_shopify_admin_url}/graphql.json`,
{
query: stagedUploadsQuery,
variables: stagedUploadsVariables,
},
{
headers: {
"X-Shopify-Access-Token": your_shopify_admin_token,
},
}
);
console.log("Staged upload created:", stagedUploadsQueryResult.data);
const target = stagedUploadsQueryResult.data.data.stagedUploadsCreate.stagedTargets[0];
const params = target.parameters; // Parameters contain all the sensitive info we'll need to interact with the AWS bucket.
const url = target.url; // This is the url you'll use to post data to AWS.
const resourceUrl = target.resourceUrl; // This is the specific URL that will contain your image data after you've uploaded the file to the AWS staged target.
// Post to temp target (AWS S3)
console.log("Posting file to temporary target...");
const form = new FormData();
params.forEach(({ name, value }) => {
console.log(`Appending param - name: ${name}, value: ${value}`);
form.append(name, value);
});
form.append("file", file); // Append the file
// Log form headers and URL
console.log("Form Headers:", form.getHeaders());
console.log("Uploading file to AWS S3 via URL:", url);
// Perform the upload with increased timeout (120 seconds)
const response = await axios.post(url, form, {
headers: {
...form.getHeaders(), // Pass the headers generated by FormData library.
"Content-Length": fileSize + 5000, // Adjust content length.
},
timeout: 120000, // Set timeout to 120 seconds (longer timeout).
});
console.log("Upload Response:", response.data);
console.log("File uploaded to temporary target.");
// Create the file in Shopify
console.log("Creating file in Shopify...");
const createFileQuery = `
mutation fileCreate($files: [FileCreateInput!]!) {
fileCreate(files: $files) {
files {
alt
}
userErrors {
field
message
}
}
}
`;
const createFileVariables = {
files: [{
alt: "alt-tag",
contentType: "IMAGE",
originalSource: resourceUrl, // Use the resource URL.
}],
};
const createFileQueryResult = await axios.post(
`${your_shopify_admin_url}/graphql.json`,
{
query: createFileQuery,
variables: createFileVariables,
},
{
headers: {
"X-Shopify-Access-Token": your_shopify_admin_token,
},
}
);
console.log("File created in Shopify:", createFileQueryResult.data);
} catch (error) {
console.error("Error during file upload:", error.message);
if (error.response) {
console.error("Error response:", error.response.data);
}
}
}
// Execute the async function
uploadFile().catch((error) => {
console.error("Error during file upload execution:", error);
});