Sorry, no results found for "".
⚠️ We highly advocate for utilizing our JavaScript client when uploading new assets, as it comes equipped with high-level helper methods that handle all the nitty-gritty for you.
Uploading a new asset to a DatoCMS project manually is a process that necessitates several HTTP calls. This approach significantly accelerates the upload process for DatoCMS, as it eliminates the need for us to act as an intermediary between you, the user aiming to upload an asset, and the storage bucket.
First, send a POST
request to the /upload-requests
endpoint to obtain the location on which to perform the physical file upload:
POST https://site-api.datocms.com/upload-requests HTTP/1.1Authorization: Bearer YOUR-API-TOKENAccept: application/jsonX-Api-Version: 3Content-Type: application/vnd.api+json
{ "data": { "type": "upload_request", "attributes": { "filename": "image.png" } }}
curl -g 'https://site-api.datocms.com/upload-requests' \ -X POST \ -H "Authorization: Bearer YOUR-API-TOKEN" \ -H "Accept: application/json" \ -H "X-Api-Version: 3" \ -H "Content-Type: application/vnd.api+json" \ --data-binary '{"data":{"type":"upload_request","attributes":{"filename":"image.png"}}}'
await fetch("https://site-api.datocms.com/upload-requests", { method: "POST", headers: { Authorization: "Bearer YOUR-API-TOKEN", Accept: "application/json", "X-Api-Version": "3", "Content-Type": "application/vnd.api+json", }, body: JSON.stringify({ data: { type: "upload_request", attributes: { filename: "image.png" } }, }),});
HTTP/1.1 202 AcceptedContent-Type: application/jsonCache-Control: cache-control: max-age=0, private, must-revalidateX-RateLimit-Limit: 30X-RateLimit-Remaining: 28
{ "data": { "type": "upload_request", "id": "/7/1455102967-image.png", "attributes": { "url": "https://dato-images.s3.eu-west-1.amazonaws.com/205/1565776891-image.png?x-amz-acl=public-read&...", "request_headers": { "X-Foo": "bar" } } }}
Now it is possible to use the obtained information to build an HTTP request that effectively uploads the file:
PUT
url
attribute of the previous responserequest_headers
attribute of the previous response MUST be set as a request headerContent-Type
header to specify the type of file being uploadedPUT https://dato-images.s3.eu-west-1.amazonaws.com/205/1565776891-image.png?x-amz-acl=public-read&... HTTP/1.1Content-Type: image/pngX-Foo: bar
<YOUR_FILE_BINARY_CONTENT>
curl -g 'https://dato-images.s3.eu-west-1.amazonaws.com/205/1565776891-image.png?x-amz-acl=public-read&...' \ -X PUT \ -H "Content-Type: image/png" \ -H "X-Foo: bar" \ --data-binary '<YOUR_FILE_BINARY_CONTENT>'
await fetch( "https://dato-images.s3.eu-west-1.amazonaws.com/205/1565776891-image.png?x-amz-acl=public-read&...", { method: "PUT", headers: { "Content-Type": "image/png", "X-Foo": "bar" }, body: "<YOUR_FILE_BINARY_CONTENT>", },);
HTTP/1.1 202 AcceptedX-Amz-Request-Rd: XXXServer: AmazonS3
{ "data": { "type": "job", "id": "4235" }}
Make a POST
request to the /uploads
endpoint with the path being the ID of the request made on step 1.
POST https://site-api.datocms.com/uploads HTTP/1.1Authorization: Bearer YOUR-API-TOKENAccept: application/jsonX-Api-Version: 3Content-Type: application/vnd.api+json
{ "data": { "type": "upload", "attributes": { "path": "/205/1565776891-image.png", "author": "Mark", "copyright": "2020 DatoCMS", "default_field_metadata": { "en": { "alt": "Nyan the cat", "title": "My cat", "custom_data": {} } } } }}
curl -g 'https://site-api.datocms.com/uploads' \ -X POST \ -H "Authorization: Bearer YOUR-API-TOKEN" \ -H "Accept: application/json" \ -H "X-Api-Version: 3" \ -H "Content-Type: application/vnd.api+json" \ --data-binary '{"data":{"type":"upload","attributes":{"path":"/205/1565776891-image.png","author":"Mark","copyright":"2020 DatoCMS","default_field_metadata":{"en":{"alt":"Nyan the cat","title":"My cat","custom_data":{}}}}}}'
await fetch("https://site-api.datocms.com/uploads", { method: "POST", headers: { Authorization: "Bearer YOUR-API-TOKEN", Accept: "application/json", "X-Api-Version": "3", "Content-Type": "application/vnd.api+json", }, body: JSON.stringify({ data: { type: "upload", attributes: { path: "/205/1565776891-image.png", author: "Mark", copyright: "2020 DatoCMS", default_field_metadata: { en: { alt: "Nyan the cat", title: "My cat", custom_data: {} }, }, }, }, }),});
HTTP/1.1 202 AcceptedContent-Type: application/jsonCache-Control: cache-control: max-age=0, private, must-revalidateX-RateLimit-Limit: 30X-RateLimit-Remaining: 28
{ "data": { "type": "job", "id": "facf9248be977002c9bae231" }}
You can now check if the job is complete. While the job is still processing, the endpoint returns a 404
status code. Once the job is finished, it will return a 200
status code, with the upload object in the payload
.
GET https://site-api.datocms.com/job-results/facf9248be977002c9bae231 HTTP/1.1Authorization: Bearer YOUR-API-TOKENAccept: application/jsonX-Api-Version: 3Content-Type: application/vnd.api+json
curl -g 'https://site-api.datocms.com/job-results/facf9248be977002c9bae231' \ \ -H "Authorization: Bearer YOUR-API-TOKEN" \ -H "Accept: application/json" \ -H "X-Api-Version: 3" \ -H "Content-Type: application/vnd.api+json"
await fetch( "https://site-api.datocms.com/job-results/facf9248be977002c9bae231", { headers: { Authorization: "Bearer YOUR-API-TOKEN", Accept: "application/json", "X-Api-Version": "3", "Content-Type": "application/vnd.api+json", }, },);
HTTP/1.1 202 AcceptedContent-Type: application/jsonCache-Control: cache-control: max-age=0, private, must-revalidateX-RateLimit-Limit: 30X-RateLimit-Remaining: 28
{ "data": { "type": "job-result", "id": "facf9248be977002c9bae231", "attributes": { "status": 200, "payload": { "data": { "type": "upload", "id": "666", "attributes": { "size": 444, "width": 30, "height": 30, "path": "/205/1565776891-image.png", "url": "https://www.datocms-assets.com/205/1565776891-image.png", "basename": "image", "format": "jpg", "alt": "Nyan the cat", "title": "My cat", "is_image": true, "author": "Mark", "copyright": "2020 DatoCMS", "default_field_metadata": { "en": { "alt": "Nyan the cat", "title": "My cat", "custom_data": {} } } } } } } }}
RFC 4122 UUID of upload expressed in URL-safe base64 format
"q0VNpiNQSkG6z0lif_O1zg"
Must be exactly "upload"
.
Upload path
"/45/1496845848-digital-cats.jpg"
Copyright
"2020 DatoCMS"
Author
"Mark Smith"
Notes
"Nyan the cat"
For each of the project's locales, the default metadata to apply if nothing is specified at record's level.
{
en: {
title: "this is the default title",
alt: "this is the default alternate text",
custom_data: { foo: "bar" },
focal_point: { x: 0.5, y: 0.5 },
},
}
Tags
["cats"]
Upload collection to which the asset belongs
Returns a Job ID. You can then poll for the completion of the job that will eventually return a resource object of type upload