Javascript fetch not working with http://key@www.example.com

Question

I am trying to access a web-Api (Prestashops Web API to be exact) and fetch seems to have a problem with an url in this format : http://SOMEKEY12345@www.example.com. In both Chrome and Postman everything works perfectly fine but using the fetch-API I always get an 401 Error.

Here is my Typescript Code :

public fetchData() {
fetch("http://SOMEKEY1234@www.example.com").then((response : Response)=>{
  response.text().then((text : string) =>console.log(text));
})

If you check the actual request with Fiddler (or similar) has anything been altered? You could run one Postman request and one fetch request and compare both requests. — Fenton, Dec 13 '17 at 09:18

score 1 · Accepted Answer · answered Dec 14 '17 at 05:15

The Fetch API doesn’t allow a URL in the form http://SOMEKEY1234@www.example.com to be used in requests. Specifically, it doesn’t let you to use an "@" character before the hostname.

If you use such a URL, it’s interpreted as providing username/password credentials, and the Fetch spec requires browsers to throw a TypeError (and thus to halt the request):

The Request(input, init) constructor must run these steps:
…
If parsedURL includes credentials, then throw a TypeError.

The only solution is to not put credentials in the request URL in the way (that is, don’t have a "@" character before the hostname in the request URL).

Javascript fetch not working with http://key@www.example.com

1 Answers1