Change Default Action of IFRAME Hyperlink Clicks - javascript

I'm using Google search in a page, and it shows up in an IFRAME. However, when you click on a link in the search, it's leaving my site and redirecting to that other site. Is there a way to intercept that call with jQuery and make it open that link in a new window, instead?

Due to security reasons, what you can do with an iframe is very limited (In cases where you frame another domain).
The way this is implemented varies a bit from browser to browsers but most browsers won't let you manipulate the data in the iframe.
To my knowledge this isn't possible, assuming you are refering to an implementation of http://www.google.com/cse/

Related

How to recall browser tab with previous instance on same page

I have a page with a few links.
Each link opens in a new tab.
The next time I click a given link, I want it to recall the same tab where it was previously opened.
Is it possible? How?
All pages come from the same domain.
I've seen this answer:
Check if my website is open in another tab
It seems possible to store the URIs in localStorage, for repetitions detection.
I think this technique will allow me to detect repetitions, but I can't figure out how to aim at the specific tab (activate it, bring it to the front).
I don't control the server, need to implement it in the client (via Tampermonkey).
For the curious, I work a lot with BitBucket issues.
The page with the links is the issues listing, the other pages are the individual issues.
I want to be protected from opening the same issue twice, update both versions, and have a data loss.
Additionally, each page can have two different URIs, one for viewing and the other for editing. But I think I can solve it with JS.
Recalling a Browser Tab by Name
You can first specify a name for each tab you create, by using window.open():
let newWindow = window.open(newUrl, newWindowName);
or by using target attribute in an anchor tag:
Make New Window
If you then call window.open with the name of an existing tab, that will use the existing tab. If the window by that name doesn't exist, window.open will create a new window (or tab).
MDN web docs page for Window.open
Bringing Window to the Front
Using window.open() alone may not be enough to bring the window to the front. That may be possible with a different function, window.focus(), which issues a request to bring the window to the front. Combining the two:
window.open(myUrl, myWindowName).focus();
Caution: A browser's user preference setting may still prevent focus() from bringing the window to the front, so this is not guaranteed to work. From MDN web docs:
It may fail due to user settings and the window isn't guaranteed to be frontmost before this method returns.
You can get the previous page's URL with the following:
let prevURL = document.referrer;
You can get the URLs from all open tabs with the windows.getAll() function.
From this answer - You cannot programmatically focus the browser to a specific tab due to security concerns. Consider updating the title to notify the user with document.title = {{new title}}

How can I prevent Iframe messing browser's history after interactions with it?

So in my case I use Iframes to attach Grafana to my page (which provides me beautiful and easy to use graphs).
It's possible to notice that Grafana's Iframes triggers a kind of refresh on my Angular page after each interaction of zoom in or zoom out (using mouse clicks) on the graph thus messing broswer's history. I don't see any changes on Iframe's src to justify this page refresh and it doesn't trigger anything apparently (doesn't trigger any onload, for example).
Is this a normal behavior? How can I prevent this?
I am using a scripted dashboard of Grafana version 6.2.2 along with Angular 6.1.
Hoping to help out, some things that I might try in your scenario:
A blank html page with only a grafana Iframe in it. See if it still refreshes the parent page. If not, then maybe the problem is with angular.
You said sandbox breaks the iframe? Maybe play around with different sandbox values. Like allow-scripts and see if it needs one of those values to work
https://www.w3schools.com/tags/att_iframe_sandbox.asp
Maybe try putting the grafana iframe in another iframe. I've never done this before, but maybe it will try to refresh the parent iframe instead of the parent page.
It could be helpful to post your angular html code to the question too. Might be some hints in there.
Without the effective implementation of the iframe is difficult to suggest the best way to act.
The simplest solution that comes in mind is iframe's sandbox attribute:
<iframe src="my_iframe.html" sandbox></iframe>
What's an iframe sandbox ?
The sandbox attribute enables an extra set of restrictions for the content in the iframe.
When the sandbox attribute is present, and it will:
treat the content as being from a unique origin
block form submission
block script execution
disable APIs
prevent links from targeting other browsing contexts
prevent content from using plugins (through , , , or other)
prevent the content to navigate its top-level browsing context
block automatically triggered features
The value of the sandbox attribute can either be just sandbox (then
all restrictions are applied), or a space-separated list of
pre-defined values that will REMOVE the particular restrictions.
Ref: https://www.w3schools.com/tags/att_iframe_sandbox.asp
You can overwrite the <iframe>'s pushState and replaceState functions:
iframe.contentWindow.history.pushState = new Proxy(iframe.contentWindow.history.pushState, {
apply: () => {},
});
iframe.contentWindow.history.replaceState = new Proxy(iframe.contentWindow.history.replaceState, {
apply: () => {},
});

How to open a url in an already existing browser tab?

I'd like to do the following in my application via javascript.
1) Press a button from a web page that opens a popup.
2) Select some options in the popup and accept them.
3) Change the content of what is in the first web page according to what has been selected in the popup and change it. A GET Request is acceptable, and if possible popup with the selected options should again be on top, either by putting it on top or by opening a new one with the same options chosen.
I think javascript must have some way of saving the name of the browser tabs your are opening and later, if you want, open a new URL, or put one over other but I cannot find them. The window.open options doesn't look like they can do this.
Any idea on how to achieve this thing? Thanks for your time.
You can try the window.opener method in the popup to access the main page. High level details here: http://www.w3schools.com/jsref/prop_win_opener.asp, but if you Google it there's examples.
We did this for a project and it works, with a few caveats:
Cross domain basically doesn't work, if you have multiple domains you have to get more creative.
Be careful cross browser as well, we had to add some custom javascript to handle
Basically, what you need to do on your main page is define a global javascript method that does what you want it to (it can take parameters). Then, on your popup, you can call it with window.opener.MethodNameHere();
Theoretically, if you do need to handle cross browser, you can try using postmessage, which I believe is only supported in html5 natively (there are plugins for html4), but it would probably be tricky getting it right in this circumstance and I'm not sure how to do it off the top of my head.

chrome extension opens with page load

I need to create a chrome extension that for every web page te he user opens - he will have a button on top of the page (similar to the google translate extension - just that it will appear with page load, without the need to press a button) - preessing on it will do some activity.
from what i saw - the way to do it is to create a content script that will add an iframe that includes the button on the window.onload. just before i do that - i want to be sure there is no more simple way of doing that.
Thanks.
There is an experimental infobar API, but it's unknown when, if ever, it becomes stable.
As-is, you really need to inject your UI into the page DOM from a content script, with an iframe being a good solution to separate your UI from the page.
If it's just a button for each page then you could use a Browser Action
If you'd like for it to actually be in the page then an iframe is a good way to go.

programmatically click an input button in another web page?

I know there have been several similar questions, but I haven't seen an answer to my specific need: Is there a way to click a button in a separately launched web page? For example, I launch another web page via:
<a href="x" target="y"> or
window.open()
Can I then click an input button in that launched web page programmatically?
Unless the page is underneath your own control or resides on the same domain then no, it is not possible. This would be cross-site scripting and all browsers have security sandboxes in place to keep something like this from happening. Why are you trying to programmatically press a button on a page that you're also programmatically opening?
Yes. When you do window.open it will return you a window object. Var win = window.open(); win.fnSubmit(); assuming fnSubmit is the function on the other page that will do the.clicking. and both pqges on the same domain.
This is a technique used by some hacking injection attacks. Basically you can inject javascript into the querystring that can attach itself to the DOM, change an image or swf file source or simply run when the page is loaded; example here and example here.
Or if you already know the structure of the other page you can directly target methods or objects.
But as these are not nice things I assume that you have good reasons why you can't touch the code on the receiving page but want to adjust its behaviour?
You can click on any element you can select.
You can only select elements in windows that you have security privelages to.
You have rights to your own window, and rights to windows within the same domain & security.
To access the element you'll need the window object, which is returned from window.open
var newWin = window.open(siteYouHaveAccessTo);
newWin.document.getElementById('foo').click();
If you're trying to click on the Search button on www.google.com, you're SOL.
Survey says... maybe. If you've done your homework, you will probably be able to get communication to happen within the same subdomain. It gets progressively more difficult from there -- I've never had consistent cross-browser sub-domain support for manipulating JavaScript between two windows (or iframes).
That said, if they are the same domain, it is a matter of descending into it. If I have:
Window A opens Window B
Window B declares var winBVar
Window A is able to access winBVar after, and only after, that variable is declared (as in, you still need to wait for document.onload, etc)

Categories

Resources