search

http-party / http-server

a simple zero-configuration command-line http server
MIT License
13.58k stars 1.49k forks source link

Using `location` as an alias in a for loop permanently redirects even after reinstalling http-server and clearing cache #813

Closed justingolden21 closed 2 years ago

justingolden21 commented 2 years ago

So I have a simple project and I installed http-server recently. I have a single index.html file. The server and project works fine. I've worked on it for several days, updating the files and refreshing chrome.

Today, I worked on the project for a bit. I added one line of code that loops through a locations list and multiplies numbers. Now, every single time I visit http://127.0.0.1:8080/ it redirects to http://127.0.0.1:8080/sydney. I have no idea why. One of the locations has the key "sydney." It appears nowhere else in the codebase. It's a very small codebase. I restarted http-server and it still redirects. I hard refreshed the page and it still redirects. I cleared cookies (there were none) cleared cache (none) cleared local storage (none) and killed the server, uninstalled and reinstalled http-server and opened the page again. It STILL redirects to /sydney and I have no clue why. In incognito it works, in Firefox it works, in Brave (built on Chromium) it works, and in the 192.168 port it works. But now chrome permanently redirects every time.

I've been on this for hours and cannot figure it out. I've searched google and the tickets in this package and can't figure it out. I've never seen this behavior in my life. It's literally just a project with a single html file, a single css file, and a single js file. There isn't even a favicon or a package.json or anything. I have no redirect logic, I don't even have any other pages or a 404 page. And I never once typed "/sydney" into the browser.

I changed a lot of lines of code nd it would continuously update the page with my changes, and then I changed one line, adding in a loop similar to:

for(location in locations) {
  locations[location][1] *= 5/6;
}

which isn't even valid syntax in the project anyway, and then it began redirecting me.

This is the ONLY place sydney appears in the entire project:

  const locations = {
    sydney: [1150, 600],
    "new york": [340, 260],
    "los angeles": [165, 290],
    vancouver: [175, 225],
    "hong kong": [1035, 350],
    berlin: [640, 220],
    london: [600, 220],
    rio: [425, 550],
    mumbai: [880, 360],
  };

(apologies for the inconsistent quotes, I haven't even set up ESLint rules for this project. I've only worked on this project for a few hours total).

I'm completely mind-boggled as to how this could happen. I'm wondering if some weird race condition with updating the code could cause chrome to cache something internally that can't be cleared. There's no other explanation for it.

Environment Versions

  1. OS Type: Windows 10
  2. Node version: 16.13.0
  3. http-server version: 14.1.0

Steps to reproduce

  1. npm install -g http-server
  2. npx http-server .

Expected result

No redirect

Actual result

Redirect

Screenshots

image

image

C:\Users\justin\Documents\myproject>npx http-server .             
Starting up http-server, serving .

http-server version: 14.1.0

http-server settings: 
CORS: disabled
Cache: 3600 seconds
Connection Timeout: 120 seconds
Directory Listings: visible
AutoIndex: visible
Serve GZIP Files: false
Serve Brotli Files: false
Default File Extension: none

Available on:
  http://192.168.1.87:8080
  http://127.0.0.1:8080
Hit CTRL-C to stop the server

> [2022-05-20T19:31:11.167Z]  "GET /sydney" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) 
Chrome/101.0.4951.67 Safari/537.36"
(node:14768) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
(Use `node --trace-deprecation ...` to show where the warning was created)
[2022-05-20T19:31:11.172Z]  "GET /sydney" Error (404): "Not found"
>
justingolden21 commented 2 years ago

Solved by clearing browsing data:

image

image

But this bug should be investigated so people in the future don't have to waste hours of time on this.

justingolden21 commented 2 years ago

So clearing cache, cookies, local storage, tuning off all extensions, killing the server, completely uninstalling and reinstalling the server package, and hard reloading the page didn't fix it, but clearing browsing data in chrome did... And adding the line back breaks it again...

  const locations = {
    sydney: [1150, 600],
    "new york": [340, 260],
    "los angeles": [165, 290],
    vancouver: [175, 225],
    "hong kong": [1035, 350],
    berlin: [640, 220],
    london: [600, 220],
    rio: [425, 550],
    mumbai: [880, 360],
  };

  for (location in locations) {
    locations[location][1] *= 5 / 6;
  }
justingolden21 commented 2 years ago

Even after clearing browsing data, it doesn't work any more... It only works if I remove the code.

Sure enough, commenting the sydney line gets me redirected to http://127.0.0.1:8080/new%20york, sure enough commenting the loop doesn't fix it and I have to once again clear browsing data. Oddly enough, after commenting sydney and the loop other than a console log, and clearing browsing data (so my code looks like below) it redirects to /mumbai

  const locations = {
    // sydney: [1150, 600],
    "new york": [340, 260],
    "los angeles": [165, 290],
    vancouver: [175, 225],
    "hong kong": [1035, 350],
    berlin: [640, 220],
    london: [600, 220],
    rio: [425, 550],
    mumbai: [880, 360],
  };

  for (location in locations) {
    console.log(location);
    // locations[location][1] *= 5 / 6;
  }

Terminal output:

Available on:
  http://192.168.1.87:8080
  http://127.0.0.1:8080
Hit CTRL-C to stop the server

[2022-05-20T19:56:01.629Z]  "GET /sydney" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
(node:39032) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
(Use `node --trace-deprecation ...` to show where the warning was created)
[2022-05-20T19:56:01.636Z]  "GET /sydney" Error (404): "Not found"
[2022-05-20T19:56:03.350Z]  "GET /sydney" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:03.353Z]  "GET /sydney" Error (404): "Not found"
[2022-05-20T19:56:13.823Z]  "GET /sydney" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:13.825Z]  "GET /sydney" Error (404): "Not found"
[2022-05-20T19:56:15.228Z]  "GET /" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:15.257Z]  "GET /main.js" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:15.263Z]  "GET /styles.css" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:15.459Z]  "GET /favicon.ico" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:15.461Z]  "GET /favicon.ico" Error (404): "Not found"
[2022-05-20T19:56:47.574Z]  "GET /" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:48.646Z]  "GET /" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:48.666Z]  "GET /main.js" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:48.671Z]  "GET /styles.css" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:48.813Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:56:48.814Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:57:18.325Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:18.327Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:57:18.782Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:18.783Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:57:18.942Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:18.943Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:57:41.907Z]  "GET /" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:41.935Z]  "GET /main.js" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:41.939Z]  "GET /styles.css" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.156Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.157Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:57:42.157Z]  "GET /los%20angeles" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.160Z]  "GET /los%20angeles" Error (404): "Not found"
[2022-05-20T19:57:42.160Z]  "GET /vancouver" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.162Z]  "GET /hong%20kong" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.163Z]  "GET /berlin" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.165Z]  "GET /london" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.166Z]  "GET /rio" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.167Z]  "GET /mumbai" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:57:42.168Z]  "GET /vancouver" Error (404): "Not found"
[2022-05-20T19:57:42.169Z]  "GET /hong%20kong" Error (404): "Not found"
[2022-05-20T19:57:42.169Z]  "GET /berlin" Error (404): "Not found"
[2022-05-20T19:57:42.170Z]  "GET /london" Error (404): "Not found"
[2022-05-20T19:57:42.170Z]  "GET /rio" Error (404): "Not found"
[2022-05-20T19:57:42.170Z]  "GET /mumbai" Error (404): "Not found"
[2022-05-20T19:58:34.822Z]  "GET /mumbai" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:34.823Z]  "GET /mumbai" Error (404): "Not found"
[2022-05-20T19:58:36.194Z]  "GET /" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.227Z]  "GET /main.js" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.231Z]  "GET /styles.css" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.482Z]  "GET /new%20york" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.483Z]  "GET /new%20york" Error (404): "Not found"
[2022-05-20T19:58:36.483Z]  "GET /los%20angeles" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.485Z]  "GET /vancouver" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.486Z]  "GET /los%20angeles" Error (404): "Not found"
[2022-05-20T19:58:36.488Z]  "GET /vancouver" Error (404): "Not found"
[2022-05-20T19:58:36.489Z]  "GET /hong%20kong" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.490Z]  "GET /berlin" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.491Z]  "GET /london" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.492Z]  "GET /rio" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.492Z]  "GET /mumbai" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36"
[2022-05-20T19:58:36.494Z]  "GET /hong%20kong" Error (404): "Not found"
[2022-05-20T19:58:36.494Z]  "GET /berlin" Error (404): "Not found"
[2022-05-20T19:58:36.495Z]  "GET /london" Error (404): "Not found"
[2022-05-20T19:58:36.495Z]  "GET /rio" Error (404): "Not found"
[2022-05-20T19:58:36.495Z]  "GET /mumbai" Error (404): "Not found"

I once again tried killing the server, closing the tab, clearing browsing data, opening the server, and opening the tab to 127... and hard refreshing, and I get redirected to http://127.0.0.1:8080/mumbai and the only code is a console log loop with sydney commented out... This is truly mind-boggling. Surely it has something to do with http-server using location or locations but why isn't the topmost item being used any more, and why is it inconsistent? I'm trying to dig as deep as I can to help you guys debug / reproduce this.

Restarting the server and cleaing browsing data again, and replacing the loop with:

  for (location in locations) {
    console.log("hello world");
  }

it works on refresh but not on hard refresh, the opposite of what I had when it worked the first time.

Even after commenting the entire loop, clearing browsing data, and hard refreshing it still breaks. I also have to kill the server every time.

Even then, it's STILL redirecting to /mumbai, and I killed the server, cleared the browser cache, and removed the entire console log loop and hard refreshed. Very inconsistent. Upon trying a second time, it works, the exact same steps and order.

Having an empty loop: for (location in locations) {} breaks everything as well.

And of course, renaming locations to mapLocations and adding an empty loop:

  const mapLocations = {
    // sydney: [1150, 600],
    "new york": [340, 260],
    "los angeles": [165, 290],
    vancouver: [175, 225],
    "hong kong": [1035, 350],
    berlin: [640, 220],
    london: [600, 220],
    rio: [425, 550],
    mumbai: [880, 360],
  };

  for (mapLocation in mapLocations) {
  }

doesn't break it.

I'm also able t console log the locations:

  for (mapLocation in mapLocations) {
    console.log(mapLocation);
  }

And I get the correct output.

And of course, upon trying to console log location and locations after the rename, you get exactly what you'd expect, the global window variable for location and an uncaught reference error:

image

Adding back for (location in locations) {} after the variable rename, it still works fine, and I'm able to get Uncaught ReferenceError: locations is not defined at window.onload as expected

UPDATE: it was all working after normal refresh, but upon hard refresh it broke, will continue investigating

MINIMUM CODE THAT BREAKS IT:

This code works:

  const items = {
    hello: "world",
  };

But this code breaks it:

  const items = {
    hello: "world",
  };
  for (location in items) {
  }

Using location as an alias in a for loop breaks everything... Absolutely crazy...

zbynek commented 2 years ago

I assume the code with location runs in browser, therefore this has nothing to do with http-server and would be better posted on a site like Stack Overflow.

That being said, the problem is that location is a global object in JavaScript and assigning to it redirects the browser. 

for(const location in locations) {
...
}

should do the trick because const limits the scope of location to the loop. Using const to make sure your loop variable is not global is a good practice. Also not using variable names that overlap with global objects is good for readability.

justingolden21 commented 2 years ago

Thank you for the quick reply and absolutely agree about using const for loop variables and not overlapping the global namespace. I did find that opening the file in chrome without http-server still redirects to /hello, so that's simply a Javascript quirk, nothing that http-server needs to fix.

Sorry for the long spam of messages (just wanted to document everything) and I'll go ahead and close this ticket 😅