My website uses AngularJS (v1) with webapi. I have a file upload directive that posts to my file upload controller. On some calls to the file upload, I get a 404 not found on a valid address. Most of the time it works as expected. If I look through the Application Insights on Azure, I can see some weird reporting in regards to the file upload api. See images
In the first image in the left column, I can see 8 errors reported with a POST to /api/fileupload/upload. Middle column shows all 8 are 404s, and in the third column, I can see the request URL, which if I copy and paste into the browser, doesn't return a 404 (returns a 405, method not allowed which I'd expect as it doesn't support GET requests but it does find the url).
The second image shows a valid api request (this error is expected). The left column shows a POST to fileupload/upload (NOT /api/fileupload/upload/ as in the first image that 404s), but the middle and left columns show the same request URL as the 404 in the first image.
In angular, I only call the API from one spot in my file upload directive:
angular.element($element).fileupload({
url: 'api/fileupload/upload/',
type: 'POST',
...
...
});
What are these 404s? How can I stop them? How can I find out where its going wrong?