microsoft azure file upload api creation in javascript

144 Views Asked by At

https://learn.microsoft.com/en-us/azure/developer/javascript/tutorial/browser-file-upload-azure-storage-blob

I used this sample repo and was following the step by step procedure given in this website. I got stuck at point no-9. Can anyone help me with the same by providing me screenshot of every step after 9th. (Where is azure explorer and what to do after going to source control [enter image description here](https://i.stack.imgur.com/n9afP.png)

Till point no-8 its working fine but I am unable to understand what to do after 8

1

There are 1 best solutions below

2
On

I tried in my environment and got below results:

The step is to Deploy static web app to Azure. In visual studio you need to sign in with azure subscription by left side panel clicking Azure symbol you can be able to add to your subscription by signing in.

enter image description here

After signing in click, the resource + symbol and create static web app.

enter image description here

To create enter your static app name, resource group, SKU, default project structure-react, location of your application code-/appname, path of your build output- Build, location for new resources-location you needed. After creation you will get notification in bottom like in document.

The 10th step is adding our azure storage secrets to github secrets:

https://github.com/YOUR-GITHUB-ACCOUNT/js-e2e-browser-file-upload-storage-blob/settings/secrets/actions

enter image description here

Add the two secrets and their values by creating new repository secret with name and secret.

Once you set the secrets in your visual studio code .github/workflows workflow add the two environment variables.

 env: # Add environment variables here
            REACT_APP_STORAGESASTOKEN: ${{secrets.REACT_APP_STORAGESASTOKEN}}
            REACT_APP_STORAGERESOURCENAME: ${{secrets.REACT_APP_STORAGERESOURCENAME}}

By clicking the Synchronize changes symbol in the status bar, you can push to your GitHub fork.

enter image description here

Now you can deploy in web sites by clicking browse sites.

enter image description here

You can now upload the image and using static web site.

enter image description here

Reference: JavaScript: Upload image to Blob Storage - Azure | Microsoft Learn