How to run Javascript in newly opened window? - javascript

Let's say I have the following code.
window.open(url, windowName, "height=500,width=500")
// This will open a new window with the url.
myFunction();
// Run this function on the newly opened window instead of
// the old one because I need to find a link on the new page.
Right now, myFunction() is getting stuck on the old window.
Update: The new url is the another domain.

Put your myFunction() in the script of the new window.
Then set the onLoad event of that window to run it.
You can get reference to your caller window's document from the new window by:
window.opener.document
There you go with enough links to do pretty much anything.
Update:
Your new window should be from the same domain. Otherwise its against the same origin policy of the browser.
Please see this question:
Ways to circumvent the same-origin policy

You have several options:
edit the source code for the webpage stored at url to include your own custom code that you want to run when the webpage opens. If you only want this code to run when the webpage opens from your popup, you could name the url something like "webpage.html?run_custom_code", then in webpage.html have javascript that only runs if window.location.href.indexOf('run_custom_code') > 0
you can open a webpage that's sole purpose is to run javascript: window.open('javascript:alert()'); although based on your edit this does not seem useful to you.
Use another language like PHP, where you can fetch the contents of another webpage with something like $html = file_get_contents($url);
perform an ajax request to the other url (if it resides on the same domain) and scrape the results to find your link.

Related

Cannot get reference to one page from another

I am working on a web app that needs to have two parts. The one is a controller and the other is a display. Something like Google Slides in presentation mode. The controller has a button to launch the display:
<script language="JavaScript">
function OpenMain()
{
var MainPage = window.open("TheUltraSignalLite.html");
TimerIMG = MainPage.document.getElementById("TimerIMG");
TimerIMG.src = "TM-Full-Blue.jpg";
}
</Script>
The call to window.open seems to return null. I have tried Chrome, Edge, Firefox, and Opera and they all have the result. These are all local files for now, but I might put in on a web server someday. I have seen some answers that want you to turn off security, but I cannot ask everyone who uses this app to turn off security. How do I get a valid reference to the display window?
Edit 1:
Yes, window.open from the local disk does cause a CORS restriction.
I tried this where both files are in the same AWS S3 Bucket, so the CORS should not be an issue. But I still get a null on the window.open. If I put a breakpoint on the first line, then everything worked. If I split the open and the rest of the code into two functions with two buttons, it works. So it looks like I have to find a way to run the open in an async way.
Edit 2
My solution to keep it simple was to put the window.open in the OnLoad event. This opens the child window and allows it to fully render and the value of MainPage is ready to use. (I changed the MainPage to a global variable.) I still have to run it from some type of web server, rather than loacl file, but that is not a big deal.
If you are not allowed to access the new window content, then the problem you are encountering is a basic security feature of web browsers. Citing mdn:
The returned reference can be used to access properties and methods of the new window as long as it complies with Same-origin policy security requirements
To read more about Same-origin policy
If your new window respects the Same-origin policy, then you can access the content of the new window with for example:
// Open index.html from the current origin
const newWindow = window.open('index.html')
const h1 = newWindow.document.querySelector('h1')
If you want to avoid asking users for pop-up permission, then you should probably use a link instead of a pop-up.

javascript link window open without extra slash

Let's say I am currently at the following link:
"localhost/admin/test" when i do
window.open("/user/list/2034", "_blank")
it will appear like this:
localhost/admin/test/user/list/2034
what can i do to make it like this instead?
localhost/user/list/2034
I am assuming that windows should be window. If it really is windows then you have a custom object and need to show us what that is before we can answer your question.
The other point to note is that window.open will open a new window, regardless what you name it, so you don't need to use the _blank name. You only need to specify a name if you want to subsequently reuse that window (e.g. open another URL in the same other window).
When at http://localhost/admin/test, if you do:
window.open("/user/list/2034")
It will go to http://localhost/user/list/2034, unless...
window.open has been redefined somewhere. You can do console.log(window.open) and the console should say something like ƒ open() { [native code] } if it hasn't been redefined.
Your web server is responding to /user/list/2034 with a redirect to /admin/test/user/list/2034. The network tab in your developer console will show you the HTTP requests and responses where you can see if the web server is redirecting.
Your link really doesn't start with a / and you actually have window.open("user/list/2034")
You're viewing a cached version of the page with the above error in it, the source code is fixed but the browser hasn't loaded it. Try again in a private browsing window to see if it still happens.
You have some browser plug-in or extension interfering with your page. Try another browser/computer without the extensions and see if it still happens.

_blank got blocked as pop up how can i prevent this?

I have created a pdf on the server when i use:
function GetPdf(document) {
//Stores the data and creates the html,pdf file
$http.post('createpdf/', document).success(function(data){
console.log(data.filename);
window.open('download2/'+data.filename+".pdf", "_self");
});
I get a error message pop up blocked in google chrome.
When i use the option enable pop ups for this website it all works fine. Is there any way around this ? Because this could be confusing for some users.
But when i use:
window.open('download2/'+data.filename+".pdf", "_self");
It opens the page without warnings but then the main application is replaced by the pdf which is not the result i want to have.
Browsers have strict rules about when they allow JavaScript to show a popup, but they can be summarized as "Only in response to a user action".
Receiving a response to an HTTP request is not a user action, so popups are banned.
The simple solution here is to not use JavaScript. The point of Ajax is to communicate with the server without leaving the page, but you're going to leave the page anyway so there isn't really any point in using Ajax.
Just use a regular form submission.
<form method="post" action="createpdf/" target="_blank">
… then have the server side script redirect to the URL of the created PDF instead of returning the URL as JSON.
I guess you are using and external JavaScript library, I had the same issue on another Project, I used target="_tab" and it worked, I found this on this question.
It's the way Chrome handles popup calls from JavaScript when you use libraries, I used Moment.js to trigger a similar event and got the same issue.
Pop up blocking is not an issue, but a native browser feature that protect the users from popup-hell.
I would recommend to open the PDF in a modal popup instead of a new browser window.
With some jQuery code it is quite easy to implement: documentation is found here
You can always use an alternative route, for example instead of window.open function. You can use the window.location function, perhaps. Windows.location.replace which will relocate you in the same tab.
<script type="text/javascript">
<!--loc can be any changed to your window-->
var loc = "https://google.com/";
window.
window.onclick = function() {
window.open(loc);
}
</script>
Try that :)
window.open is being blocked because you are doing window.open without a click function. Most web browsers will block this feature for security purposes.

Preventing the Function to run in javascript in Iframe

I am trying to load a url in iframe which i dont have complete control . It loads the Javascript which has a Document.CreateElement and it has some reference to the window object which is failing because an iframe is not allowed to access the window. So i want to override the implementation of the function,So the function which i have written will run instead of the one written by the other website
it can't be done if the other website is not on your domain

Bookmarklet, js injection and popup issue

I'm currently writing a bookmarklet that loads and executes a remote js file by appending a new <script> tag in the current window, like so :
javascript:(function() {
if(typeof __bml_main != "undefined") return __bml_main.init();
var s= document.createElement('script');
s.type= 'text/javascript';
s.src= 'http://127.0.0.1:8000/media/bookmarklet.js';
void(document.body.appendChild(s));
})();
My bookmarklet needs to perform some dom manipulations in order to extract data from the page being viewed, and then to open a new popup to list them.
The thing is : if I want to bypass pop-up blockers, I can't open my new window from the injected script. I need to open it right from the beginning in the bookmarklet code, and to access it later when needed.
I've tried to do somehting like this :
javascript:var my_popup = window.open('http://127.0.0.1:8000/resources/manage/new/', 'newResourcePopup',config='height=200,width=400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no');
(function() {
// script injection (...)
})();
but if I then try to access my_popup from my remotely loaded script, most browsers will throw a security warning and won't let me access the Window object. This is understandable since the script is not from the same domain than the displayed page, but I'm kind of stuck...
A solution would be to use a div overlay, but I'd really prefer to open a window in this case.
Any hints ?
You could load the markup for the window as a string in your bookmarklet.js file, then (later) use window.open without a URL (or with "about:blank", I forget which is more cross-browser-compatible), and use my_popup.document.write to write the markup to the new window.
You may find that you can't open the window later, even without cross-domain issues, unless you're doing so in direct response to a user action — which is probably a good thing. :-)

Categories