Guide to accessing a newly opened window from a different domain originating from the current window

Question

Guide to accessing a newly opened window from a different domain originating from the current window

Currently working on an Angular project, I am facing a scenario where I have a link on page A that directs users to a different origin page B. The HTML code for the link is shown below:

...
<a href="https://another.origin"> PAGE B </a>
...

Once a user opens page B in a new window from page A, I need to be able to post a message to page B using

referenceOfB.postmessage(msg, bOrigin)

. In order to do this, I must first obtain a reference to page B.

I attempted to use window.open to retrieve a reference to page B, but ended up with null. I am unsure if this is the correct approach and would appreciate any insights or suggestions on how to properly achieve this task.

javascript angular typescript cross-domain

Answer 1

Answer №1

If you need to open a new window, the window.open function can help you achieve that - it will give you a reference to the newly spawned window. Once you have that reference, you can communicate with it by using the postMessage method.

For more information on the postMessage method, you can visit this link: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

var w = window.open('https://google.com')
w.postMessage('hello', "*"); // Instead of *, you can specify the target domain

Answer 2

If you need to open a new window, the window.open function can help you achieve that - it will give you a reference to the newly spawned window. Once you have that reference, you can communicate with it by using the postMessage method.

For more information on the postMessage method, you can visit this link: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

var w = window.open('https://google.com')
w.postMessage('hello', "*"); // Instead of *, you can specify the target domain

Guide to accessing a newly opened window from a different domain originating from the current window

Answer №1

Similar questions

Determined Worth of Chosen <Datalist> Option

When using ngx-slider in Angular, it unexpectedly fires off when scrolling on mobile devices

When trying to click the button in Navbar.jsx, I encounter an error when attempting to invoke the setShowCart(true) function

Error message: The context object is not iterable. Please note that it must be iterable in order to avoid

What is the method for dividing a string using capital letters as a delimiter?

Component in Next.js fetching data from an external API

Express is encountering a non-executable MIME type of 'text/html' with Webpack

Link the input's name to the parent's index in JavaScript

What is the process for executing a Node.js file using a JavaScript command?

Discover updates within a JQuery Ajax call

Manipulating JSON data fetched through AJAX beyond the success callback

What is the best way to utilize a portion of the data retrieved from an API call as the output for a function?

Webpack may suggest, "An extra loader might be needed" within a React.js project

Implementing cursor-based pagination in Next.js API Route with Prisma and leveraging the power of useSWRInfinite

Error encountered during module parsing: Unexpected token found. To resolve this issue, consider using a suitable loader to process this file format

The Controller is failing to pass JSON Data to the AJAX Call

Can you include conditional logic within a switch statement?

Tips for closing two nested Material-UI popovers when a button is clicked or when clicked elsewhere

Transferring information from offspring to parent

Making changes to a JSON file using JavaScript