Search code examples
htmlimagehttpcorscredentials

how to send credentials on an image with crossOrigin="use-credentials" when the http-server has "Access-Control-Allow-Credentials"="true"?

I have an http-server that requests with Access-Control-Allow-Credentials=true (see more details here)

and I have an app on port 8081 that requests an image from the http-server on port 8080

<img src="http://localhost:8080/img/turtle.png" crossOrigin="use-credentials" alt="alt">

currently the browser prompts for the username and password in a modal dialog (see screenshot attached) but I would like to set the username=test and password=image in the HTML, but I do not understand how the HTML IMG tag will pass through the header of the request,

is it even possible? or it this related to HTTPS and certificates?

enter image description here

Solution

  • Browsers do not provide an API that makes that possible.

    Consider using cookie based authentication (instead of Basic Auth) and redirecting through a single-sign-on style login system to set the cookies instead.