1

In my React application, I am opening a new window on click of a button. This window is being stored in a variable and I have attached functions for onkeydown and onbeforeunload events.

I have observed that these functions are being called only when the url of the window is empty.

window.open('', '', '')

For non-empty urls, these events are not being triggered.

window.open('https://wwww.stackoverflow.com', '', '')

Here is a codesandbox demonstrating this:

Edit upbeat-sanderson-bv83q

Has this got anything to do with the url itself? Please specify if I am missing anything here...

ACTUAL USE CASE:

In my frontend application (which runs on port 3000), I am trying to open a new window which opens the backend URL (which runs on port 8000). So, on a button click in http://localhost:3000, a new window will be opened which points to http://localhost:8000/api/something.

So, I added nginx as a reverse proxy and point '/' to 3000 and '/api' to 8000 and access both of these under port 80 as follows:

http {
    upstream backend {
        server 127.0.0.1:8000;
    }

    upstream frontend {
        server 127.0.0.1:3000;
    }

    server {
        listen 80;

        location /api {
            proxy_pass http://backend;
        }
    
        location / {
            proxy_pass http://frontend;
        }
    }
}

So, now I am able to access the ui application by going to http://localhost and on the button click, the new window will open http://localhost/api/something. Shouldn't this overcome the same origin issue?

Sreekar Mouli
  • 1,313
  • 5
  • 25
  • 49

1 Answers1

0

You are not missing anything. It's working as expected. Due to the same origin policy, it prevents Javascript from detecting this event across domains.

Update:

If you're looking for a workaround, you should probably see this answer as they discussed this issue and suggested some solutions. Besides, As you should have the same host and port for API and front end after reverse proxy, it seems to me that the same-origin policy would not be an issue anymore.

alisasani
  • 2,808
  • 1
  • 7
  • 15