StagedUploads get a permanent CDN url

[kelreel]

Hi! I use the stagedUploadsCreate method to upload the file, then use the fileCreate method throw GraphQL API. But the url received in the "resourceUrl" field is not quite correct - the file is deleted from the staged cdn (shopify-staged-uploads.storage . googleapis ...) after a few days. How do I get the final url of a file that is served via Shopify CDN (as in "settings" - "files" in Admin panel)?

 

[ShopifyDevSup]

Hi @kelreel 👋

You can use the `fileCreate` mutation to create file assets that are added to the Admin > Settings > Files page.

Hope that helps!

[kelreel]

I am already using fileCreate mutation, how can I programmatically get the url of the file from it, which will be saved on the Shopify CDN?

[ShopifyDevSup · Accepted solution]

The returned `file` is an interface, so you will need to fragment on the `GenericFile`,`MediaImage` a Video objects depending on the type of file you've created. It can be fetched as part of the fileCreate mutation or by querying the files to fragment:

mutation fileCreate($files: [FileCreateInput!]!) {
    fileCreate(files: $files) {
        files {
            ... Files
        }
    }
}

query {
    files (first:3, sortKey: CREATED_AT, reverse: true){
        nodes {
            ... Files
        }
    }
}

fragment Files on File {
    ... on GenericFile {
        url
    }
    ... on MediaImage {
        image {
            url
        }
    }
    ... on Video {
        sources {
            url
        }
    }
}

[jam_chan]

@ShopifyDevSup 

I try your code. It looks ok but the query is giving a null for the latest image:

{
    'data': {
        'files': {
            'nodes': [{
                    'createdAt': '2023-03-08T04:46:26Z',
                    'image': None
                }, {
                    'createdAt': '2023-03-07T10:32:59Z',
                    'image': {
                        'url': 'https://cdn.shopify.com/s/files/1/1498/3202/files/vadim-sherbakov-tCICLJ5ktBE-unsplash.jpg?v=1678185180'
                    }
                }, {
                    'createdAt': '2023-03-07T10:11:43Z',
                    'image': {
                        'url': 'https://cdn.shopify.com/s/files/1/1498/3202/files/food-og4.jpg?v=1678183904'
                    }
                }
            ]
        }
    },
    'extensions': {
        'cost': {
            'requestedQueryCost': 8,
            'actualQueryCost': 6,
            'throttleStatus': {
                'maximumAvailable': 1000.0,
                'currentlyAvailable': 994,
                'restoreRate': 50.0
            }
        }
    }
}

 After the file is created, the image url cannot be fetched immediately. I try to use Shopify GraphiQL App to run query again. The image url is shown again. What can I do here? Try to poll for the latest image?

[ShopifyDevSup]

Hi @jam_chan 👋

I'd recommend using `MediaImage.status` and `MediaImage.fileStatus` to poll and determine whether the URL has been generated yet.

Hope that helps!