Azure Function to Upload File in an Azure Blob Storage in Javascript
I will try to explain here how to use Azure Function to upload a file to an Azure Blob Storage.
I will assume the following :
- You already have an Azure Function Application (in my example it will be : mimiz-functions)
- You Already Have a Storage Account (mimiz-storage-account), and a container (mimiz-container)
- Maybe you already set up your local environment, but we will use the online editor to create the function
Create and configure the function
First, you need to get the Access key to the blob storage, in the Azure portal, go to the storage account, and click on “Access keys”, in the Settings section of the left menu.
Then copy one of the two “Connection string”.
Then go to the Azure Function Application, and then click on “Configuration” in the Settings section of the left menu.
Create a New application setting, with a name, and the “Connection string” copied earlier as value.
NOTE: The name should start with AzureWebJobs, AzureWebJobsMimizStorage in my example
Now we will create the real function…
On the left panel, click on Functions, then click Add, it will open a right panel, select HTTP Trigger, then name your function, keep the Authorization level to Function, and click create function.
Code the Function
Then go to the created function, and click on Code + Test in the left menu, be sure the index.js file is selected, then replace the code with the following :
Save It
Then select the file function.jsonand replace it with the code below :
Save it
Now the function is up and running, click on the “Get function URL” to get the URL of the function, then use your favorite tool to try the function (postman or curl)
curl --location --request POST 'https://mimiz-functions.azurewebsites.net/api/saveToBlob?code=nVcbBIDUgpDaSKy0uMBKnrLdLKDwQt54vF3QYkUm1Hi2FTOuVjafaw==&filename=my-file.txt' --form '=@/absolute/path/to/file.txt'File Name
As you may have seen, I used an URL Query parameter to define the filename, as it is mapped to the context.bindings. for the attribute "path": "mimiz-container/{filename}", I did not find a way to do it from the filename of the uploaded file ... If anyone knows how to do it, please send me a message !!
If the filename is not important to you, you can replace "path": "mimiz-container/{filename}" by "path": "mimiz-container/{rand-guid}" and you will not have to send a filename as a Query Parameter.
That’s It, feel free to clap, to comment or to link this article, hope it helped you.
