Why Axios' onUploadProgress never triggers when callin third party API in Typescript?

Jack Ma 0
Viewed 62

the axios.post sends a file to an Azure hosted backend API. It is in Typescript

const headers:AxiosRequestHeaders = { "Access-Control-Allow-Origin":"*", "Content-Type": file[0].type};

axios.post("https://xxxxxxx.azurewebsites.net/api/SpeechToText", formdata, {headers,onUploadProgress :(progressEvent) => {
      const progress = (progressEvent.loaded / progressEvent.total) * 90;
      console.log(progressEvent)
      setSingleProgress(progress)
      
    }})

basically even console.log is not showing anything so I assume the whole function was never triggered. I don't find any problem on the code itself, but please ask if more information needed from me.

backend axios azure typescript javascript
1 Answers

  • I think this is auth issue you don't have auth token added in the header that might be why you are not being able to trigger the function

  • you can get the function URL along with auth tokens attached to it, in the portal which then you can use in the axios.

under function tag select the desired function

enter image description here

Then click on the Get Function Url and copy the URL and use that in axios.

enter image description here

enter image description here

MohitGanorkar0
Related