We can upload files to the Azure server through API ‘PUT’ request in JavaScript. Follow the steps:
- Set up a remote server location in Azure Cloud Server. This can be done through the ‘Microsoft Azure Storage Explorer’ application by creating a blob container.
- Generate the upload link with the authorization parameter for the ‘Blob container’.
- In the javascript code import the ‘axios’ library to send the ‘POST’ request to the Azure server.
- A successful file upload will return the status ‘201’. Refer to the following code for file upload:
import axios from 'axios';
..........
let baseUploadURL = "https://a3files.blob.core.windows.net/"
let urlPath = baseUploadURL + "?sv=2021....";//Add Authorization Parameters
let headers =
{
'x-ms-blob-content-type': fileType,
'x-ms-blob-type': 'BlockBlob',
'x-ms-meta-uploadedby': userId,// Optional
'x-ms-meta-related_record_id': relatedJobRecordId,// Optional
'x-ms-meta-appversion': appVersion,// Optional
};
await axios.put(urlPath, files[i], {headers}).then(res => { // Storing file content as binary in file[i]
console.log("Response", res);
if (res.status === 201) {//Status: Created
console.log("Successfully uploaded the file");
}
}).catch(res => {
console.log("ERR", res);
alert("File upload failed. Please try uploading file again\n" + res);
});