I'm working on a private Chrome extension that injects some code into specific websites. I am successful for all except THIS 1 website (which I cant provide you with login access, sorry).
My extension doesn't detect the new(most) of the html content being loaded on the page after navigating through the site only.
For example, when I run document.documentElement.innerHTML; the return string is only the barebones of the page.
The site is using JQuery and I do have JQuery also loaded in my extension, but it still doesn't want to read any elements. The elements do show up in Developer Console but NOT on the Source Page or Frame's Source Page
I really need access to those Elements but I can't figure it out.
Any help is appreciated.
Thanks a bunch.
EDIT: Turns out nothing was working because all the new content was being loaded into an iFrame. Now I have to research iframes :(
This is what the code in the developer's tools looks like
<html>
<iframe src="..." >
#document
<html>
<div id="im trying to get">this content</div>
</html>
</iframe>
</html>
Related
This is my first post ever. Please be considerate.
I have an iframe :
<div>
<iframe id="myIFrame" src="https://app.repree.com" width="500" height="500" title="description"></iframe>
</div>
<script src="popup.js"></script>
</body>
I would like to go through the login (working as of now) and then remove or hide some of the HTML tags (not working as of now) so that only certain key features of the website appear.
Say.. only Activities and forms tab. (View picture for reference) Page after login
Each time I try to access the html of the iFrame, a null exception is shown to me. Thus, making me unable to affect the display of the page.
If anyone has any ideas, do please tell.
What I have tried so far:
Using JQuery
iFrame alternatives (webview, etc) : these would not display anything at all!
What I expected
JQuery would remove the elements successfully.
I am trying to call a parent function from inside of an iframe to remove the container div however it seems to be failing and I am unsure why. I am wondering if it is because the iframe loads before the parent window and so the function is not yet defined.
Here is my parents html:
<div align="center" id="review-embed-container" style="position: relative;">
<iframe frameBorder="0" id="review-embed-iframe" src="http://www.trampolinesshop.co.uk/review/Review-Embed.php?code=1&prod_name=test" scrolling="no" width="100%">
</iframe>
</div>
And the parents jQuery:
function InjectIframeReview() {
$("#review-embed-container").hide();
};
Now inside the Iframe page I have php that checks to see if reviews are placed, if there are no reviews it calls this javascript:
<script type="text/javascript">
window.parent.InjectIframeReview();
</script>
I can't seem to find out why the function is not firing correctly, you can see the full website it is loaded on here:
Websites JQuery (function is on line 387):
http://www.trampolinesshop.co.uk/acatalog/custom.js
A page that has no reviews (iframe on line 902 of source code):
http://www.trampolinesshop.co.uk/acatalog/8ft_Skyhigh_Trampoline_and_Safety_Enclosure.html
The Iframe that gets loaded (no review for product so just has javascript):
http://www.trampolinesshop.co.uk/review/Review-Embed.php?code=3271d&prod_name=8ft%20Skyhigh%20Trampoline%20and%20Safety%20Enclosure
A page that has a review:
http://www.trampolinesshop.co.uk/acatalog/8ft_Fun_Pink_Trampoline.html
The Iframe that gets loaded (has review so does not use javascript):
http://www.trampolinesshop.co.uk/review/Review-Embed.php?code=3269&prod_name=8ft%20Skyhigh%20Pink%20Trampoline%20and%20Safety%20Enclosure
Chrome security May be you are using chrome. If you are using chrome this problem may affect only in local server because your chrome check your domain. But when you upload it on it will work because that time your domain will same as iframe domain. So now just check it on other browsers.
This issue will solved when you upload it into live. Check this
If you use an iFrame element in an HTML document, the child page will load with all of the session and cookie data from the browser.
For example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Stack Overflow in an iFrame</title>
</head>
<body>
<h1>Stack Overflow in an iFrame</h1>
<iframe src="http://stackoverflow.com" width="640" height="480" />
</body>
</html>
Ignore for a moment that SO doesn't actually allow itself to be loaded in an iFrame. If it did, the SO page loaded by the iFrame would show you as signed in.
How can I use an iFrame without any cookies or session data? (like incognito mode in Chrome)
Why?
My company sells a product (web-app) for people to build customized websites with. When they are authenticated, and they visit their website, we show them the auth'ed version of the UI so that they can edit the content. Un-auth'ed users only see the static website. Using multiple browsers or clearing cookies is not a reasonable expectation of our users so we want to show a preview of their site to them in an iFrame so they can see what their visitors would see. We also want to show "mobile" previews of the site with smaller resolution iFrames so that they may see what their visitors would see if they came to the website on a phone. These iFrame(s) need to be loaded without access to the browser's cookies or session data so that they load in un-auth'ed mode, just like Chrome does in incognito mode.
I haven't tried anything yet because I don't know where to start. I did find out that HTML5 added some sandbox attribute values to the iFrame element, but none of them seem to help with this problem. Maybe something could be done with JavaScript, we do already use jQuery in our project.
Note: We aim to only use valid HTML5
If you fully control the webstack wouldn't it be easier to add a preview parameter that treats the user as unauthenticated?
For instance:
<iframe src="http://stackoverflow.com?preview=1" width="640" height="480" />
Followed by bypassing your authorization checks if the preview flag exists.
I am creating a personal website.So,its a very lightweight website!
The website uses jquery heavily.So if target browser doesn't have javascript enabled,my website would not work.
To resolve this issue I used this html
<html>
<head>
<script>
window.location.href="javascriptEnabled.html";
/*Since javascript is enabled redirect to javascript based page*/
</script>
</head>
<body>
Showing Static Website since javascript is not enabled..
</body>
</html>
As you can see,I am redirecting to javascript enabled page if the target browser supports it.
But if javascript is not enabled,the script would not work and then static html would be loaded which is in body tag!
I have two questions.
1>Is this the best way to resolve javacript-no javascript issue browser issue?
2>If I use window.location.href and the browser is javascript enabled,would it download the full page or would it stop at window.location.href?
To keep things simple, yes it's an OK idea. You can load content with <noscript> tags
As soon as the browser hits that window.location.href it will start redirecting, but it will still download all DOM. Browsers download all Document then it will start to render.
You can use: <body onload="document.body.style.display = 'none';"> to hide it's contents until redirect occurs.
I'm writing a firefox extension to read out the privacy settings of a facebook user. (not a facebook app!!) To switch between different websites of facebook I used iframes, but this isn't working anymore. I have this problem since 2 weeks.
$('#globalContainer').append('<iframe id="reusable_iframe" src="" width="90%"
height="400" name="reusable_iframe"></iframe>');
//....
$('#reusable_iframe').attr('src', link);
I'm follow the Same origin policy and it was working just fine since a 2 weeks!? an example:
var link = "http://www.facebook.com/editprofile.php?sk=basic";
Now I just get a blank iframe :(
the funny thing is, that if I add "http://www.youtube.com/embed/Qi_AAqi0RZM" or "http://trololololololololololo.com/" to the iframe it's working without a problem... :/
did facebook change the rules for own links in iframes? Is there a workaround? Is there an other way for me to scan different sites with firefox-extensions? i would prefer to stay with content-scripts....
Edit: This is how it looks at firebugs... also funny is that the facebook page http://www.facebook.com/undefined is working however!?
<iframe id="areusable_iframe" width="90%" height="400" name="areusable_iframe" src="http://www.facebook.com/">
<html>
<head>
</head>
<body>
</body>
</html>
</iframe>
Facebook sends the following response header to the browser:
X-Frame-Options: DENY
This cause all major browsers (even IE8 and higher) to prevent showing it inside frames.
The old way was "frame buster" using JavaScript forcing the page to open as the top window, but it's very unfriendly so it was replaced by this header in most modern websites that don't want to be displayed in frames.
Not much you can do though, sorry.
The "undefined" page is just blank content which is their 404 custom error page as it does not contain the above header, it can be displayed inside frame.
To learn more about the X-Frame-Options header see this documentation.