1

In the development environment, I don't want to make things complicated by using https and SSL/STL certifications.

I learned how to prevent Google Chrome from redirecting localhost to https, and a JSON object returned after entering http:/localhost:105/hello/ into the Chrome address bar.

What confused me is that the following does not work in the browser console(Inspect->Console) for https pages:

const url = new URL('http://localhost:105/hello/');
fetch(url).then(response => response.json()).then(json => console.log(json))

The error reads that:

GET https://localhost:105/hello/ net::ERR_SSL_PROTOCOL_ERROR
Uncaught (in promise) TypeError: Failed to fetch
at :1:1

And adding parameter {redirect: 'manual'} in the fetch method doesn't help.

Thanks to @novavanity. It does work on the page with the url http://localhost:105/hello/

I don't know why and how the http was redirected to https? How can I prevent that?

Lerner Zhang
  • 6,184
  • 2
  • 49
  • 66

2 Answers2

0

Sometimes, the redirect from HTTP to HTTPS happens due to a 307 error code (internal redirect). You can check this in the 'Network' tab of Chrome's Developer tools panel.

Where the network tab is located

So, if you had previously had the URL as HTTPS, you might want to clear your cache on Chrome and restart the app. Hope that helps.

pudgyfrog
  • 1
  • 3
-1

When you use fetch() in the browser, it automatically uses the HTTPS protocol if the current page is loaded over HTTPS. This is probably why you are getting the

ERR_SSL_PROTOCOL_ERROR

error when trying to access http://localhost:105/hello/ using fetch().

To prevent fetch() from using HTTPS, you can use the base option in the Request object that you pass to fetch():

const url = new URL('http://localhost:105/hello/');
const options = {
  base: 'http://localhost:105/'
};

fetch(url, options).then(response => response.json()).then(json => console.log(json))