Using a query from a url in an iframe - javascript

I have an iframe on my website, and the page that the iframe is of accepts referrals in the form of queries, ie /iframepage?r=123 .
Obviously any person accessing the page the iframe is on, (mainwebsite/page?r=123) wouldn't be able to get the benefits of the referral. Is there any way i can make the iframe load based on the the queries in the main url?
Thanks

You can pass url parameters to where you load the iframe. So you'd have to get the params off the url you are on, and then create the iframe in Javascript and load them on the url. Check this question How to pass parameters through iframe from parent html?

I'd use something like the following:
var param = 'yourParameter'
document.getElementById('yourIFrame').src = 'http://example.com?param=' + param;

Related

trying to access data which is inside a specific iframe

im trying to access data which is inside an iframe. There are multiple iframes on the web pages without ID tag, source of the iframe is given in html format , no external link given.
so can i switch to a particular iframe and access data inside it ??
i tried using
var ifrm = document.getElementsByTagName('iframe')[1];
var $iFrameContents = $('ifrm').contents();
$entryContent = $iFrameContents.find('div.entry-content');
but this code is NOT working. i have attached a screenshot of my coding , can anyone help me in writing a javascript/jquery to get the data in Tag inside an iframe with index 1 .
screenshot of coding
iframe.contentWindow is its internal window, and iframe.contentWindow.document is its internal document object.
But bear in mind that iframes are subject to cross-origin rules, and you won't even be able to read the URL of the iframe if it's on a different origin. You can start with a link to same-origin, but the user could navigate it elsewhere.
window.postMessage can be used to communicate between windows on different origins, if you have control of both.

JavaScript: Read URL of parent page

I have a page that is loaded inside. The application including this page is located on another domain. So the domain of my page and the application rendering it inside an iframe are located on different domains. The page inside iframe reads the URL it is loaded from to store in the database. The page loading has a hash in the URL.It is like:
https://www.somedomain.com/organizers/list/#type=current&sort=bydate
I am reading the URL from mypage. It is located on:
https://www.someotherdomain.com/organizers/#sample
var _url = document.referrer
The above code gives me the URL but only till "https://www.somedomain.com/organizers/list/", "#type=current&sort=bydate" is missing. I need that else this code is of no use to me. Is there a way I can read the complete URL without missing any segment?
like this
var _url = window.location;
This is by design. The browser will give you the referrer which is the URL where the user came from, however the #hashmark is technically (by its original design) a sub-navigation concept within a page, thus not passed on to the next page load.
If you were on the same domain as the parent page, you could access it via the
window.parent.location.hash
however since you are from a different domain this access will likely be blocked for security reasons.

How to use iFrame to match URL in separate domains

I have two websites. Domain.com and DomainTwo.com
Domain.com hosts all of the content and DomainTwo.com mirrors that content using a simple iFrame.
What I'd like to do is make it so if I link to "DomainTwo.com/folder/samplefile.jpg", the iFrame matches the URL and creates an iFrame for Domain.com/folder/sampelfile.jpg.
In other words, you wouldn't be able to tell DomainTwo.com is actually iframing anything unless you viewed the source code of the page.
Thank you!
Have you tried plopping the URI in your iframe src?
<iframe src ="http://Domain.com<?=$_SERVER['REQUEST_URI']?>">
in javascript it would be something like:
document.getElementsByTagName("iframe")[0].src = "http://domain.com" + location.pathname;
Of course clinking inside the iframe will not update the url. You'd probably be better of using wildcard domain, domain mapping, or whatever that's called.

refresh iframe after downloading a blob

I have a filebrowser on my server that uses Azure storage to store the files. The website has a feature where when you click on a file, it'll bring up a details window. I use ViewerJS to display a pdf preview of the file (if applicable), and it all works pretty well. The only problem is that when downloading the preview file, you have to reload the preview iframe manually to get it to display. The relevant php function is:
http://pastebin.com/sAyhsbfi
When this function is completed (I'm using ajax), the $.done function calls
response = JSON && JSON.parse(response) || jQuery.parseJSON(response);
$scope.pdfthingy=response; document.getElementById("viewerjs_preview").contentDocument.location.reload(true);
where response on the first line is set to the full pathname to the pdf preview file, and viewerjs_preview is the id of the relevant iframe.
For some reason, this isn't working, and the iframe isn't reloading itself. How do I make it do that when the blob has finished downloading, and pdfthingy is set?
Is the iframe’s domain the same as your host website’s domain? If not, we cannot access its contentDocument (or contentWindow) in host website’s JavaScript code.
To refresh the iframe, per my understanding you can set its src:
document.getElementById('viewerjs_preview').src = document.getElementById('viewerjs_preview').src;
Please note if the src contains a hash tag, we may need additional work. I’d like to suggest you to check What's the best way to reload / refresh an iframe using JavaScript? for more information.
Base on my experience, It is possible that we changed the IFrame URL, but the IFrame showed the preview contents. In this scenario, I suggest you can create the IFarme dynamic. For example, When you got the Blob URI form Azure storage, You could try to remove the Iframe and create a new. For instance, if Your preview content is shown in the iframe as :
<iframe id="viewerjs_preview" src = "/ViewerJS/#../azure blob storage url /pre-blobname .pdf " width='400' height='300' allowfullscreen webkitallowfullscreen></iframe>
You can try to use this code:
function recreateIFM() {
document.getElementById("viewerjs_preview").parentNode.removeChild(document.getElementById("viewerjs_preview"));
var ifm = document.createElement("iframe");
ifm.id = "viewerjs_preview";
ifm.width = "600px";
ifm.height = "400px";
ifm.src = "/ViewerJS/#../azure blob storage url /new-blobname .pdf";
document.body.appendChild(ifm);
}
Also, you can try MingXu's reference about how to refresh/reload the Iframe.
Regards,
Bill_Sww
I find the answer, the major reason is that we shouldn't use controllers to manipulate DOM.
sentence like document.getElementById("viewerjs_preview").contentDocument.location.reload(true) will not work anymore in angular scope, so you have to a directive to do it. I think the same question with you is and which's answer with most votes dose work well.
I think maybe my question was unclear, and for that I apologize. I'll try to go back and edit it tomorrow.
The solution for me was to, rather than set the src attribute of the iframe using angularjs, directly set it with
document.getElementById("iframe-id").src=/path_where_I_put_the_files/filename
(for reference I use "pdfthingy" to store the filename returned by the ajax call that downloads a blob).
This prevented the iframe from loading a null source before the filename was set.
This is perhaps part of why walkformusle has said that DOM should not be controlled in this manner.

Is there any way instead of a JS hack where I can post from an iframe to another page outside the iframe?

Is there any way instead of a JS hack where I can post from an iframe to another page outside the iframe?
the iframe is posting data to a 3rd party and then just responding back with a URL which is the redirection URl thus we cannot set the form target. We are PCI compliant and thus we cannot use window.parent.location = url;
What it boils down to, it seems, is this:
1. You get a text url from a 3rd party in the iframe.
2. You want to change your page's location to that url.
3. Unless you have control over that 3rd party, all you are going to get is that text url.
Now, the only way to change your page's location automatically is with window.parent.location (or window.location.)
If changing the url of the page with javascript is not PCI compliant then you're trying to do something that is not PCI complicant.
<form> accepts a target parameter, e.g. target="_parent"
In an anchor tag you can set target='_parent' this will cause the url to be loaded into the parent window.
No, the only way is by using javascript. But it's not really a hack to use window.parent.location = url;

Categories