Secure content from API in ionic and default request headers

Hey guys,

I’ve got a problem that I’ve been trying to tackle, but it seems a bit tricky …

Basically I’m using an API which is secure (i.e. authenticated) and I’m using token based authentication, which works fine.

However … The API also serves secure content, so if a user is logged in, they are served e.g. images from the server, but only if they are logged in, otherwise they are redirected to a login page.

So a normal <img src="" /> also needs a authentication, which is not a problem with cookie based authentication, however in my app where I want to serve the content for example via img tags, it doesn’t work, since I can’t find a way to set the header on a normal <img src=" .... " /> tag.

Setting the default $http headers didn’t quite work, as this is not a $http request.

There must be a way in ionic to modify requests going out (not just $http or $resource requests), however I had no luck finding such a solution.

Any help would be very welcome, Thanks!

For anyone facing a similar issue:
I’ve actually managed to fix / make it work myself:

The problem was overcome by modifying the API I am using slightly.

When a token is sent to the API, a normal forms validation now takes place as well (i.e. the token is just used to authenticate the user via “normal” forms authentication) and for that request the user is actually authenticated, which means any secure content can be retrieved.