I am trying to implement this file upload plunging into my project using Angularjs and .net web api token authorization
File Upload: http://blueimp.github.io/jQuery-File-Upload/
Token authorization: http://bitoftech.net/2014/06/09/angularjs-token-authentication-using-asp-net-web-api-2-owin-asp-net-identity/
I also have in angularjs module an interceptor to add the token to each request made to the server.
The issue i am having is the interceptor is not intercepting the request and attaching the token to the request when i try to upload the file. Therefore, the server is throwing a 401 Authorized. which makes sense.
My question, how can i intercept/inject the token to the file-upload post call?
After taking a close look at the fileupload options: https://github.com/blueimp/jQuery-File-Upload/wiki/Options
It says "The jQuery File Upload plugin makes use of jQuery.ajax() for the file upload requests. This is true even for browsers without support for XHR, thanks to the Iframe Transport plugin.
The options set for the File Upload plugin are passed to jQuery.ajax() and allow to define any ajax settings or callbacks."
So all i had to do was add the headers options into the fileupload options:
headers: { 'Authorization': TOKEN }