So I have a site specific bookmarklet that create a page with a toolbar (using localstorage to set/get variables) and then creates an iframe for a destination site, say www.example.com. [Idea heavily borrowed from the wonderful RWD Bookmarklet (http://responsive.victorcoulon.fr/) ]. It works great, but I wanted to provide that a clickable link to that bookmarklet (because it is a pain to add a bookmarklet in an Ipad) but unfortunately that results in the obvious XSS cross-site problems since the link does not reside within www.example.com.
To improve this experience I was wondering if it would be possible to do have a popup (like twitter's) which would exploit an existing generic loadScript function currently present on www.example.com. From within the javascript console on www.example.com I currently can invoke a supervar.loadScript("http://dl.dropboxusercontent.com/s/blah/thefile.js") and it works. Which means I do not need to append or cross load the js into the iframe but I would need the iframe itself to invoke the supervar.loadScript call.
It is possible to invoke the supervar.loadScript on say a window.onload/document.ready type scenario or would the context of the popup code be pointing to about:blank/notexample.com in which case the supervar would not exist. Could window.postMessage be of any use?
UPDATE: Clarification
I am trying to have a button which would contain javascript code that in turn would open a new window/tab to a site but would be able to invoke a command on a variable that will be present when the DOM is ready.
Again, I'm quite new to XSS so I'm not sure if this is a security problem on the site. I'm not trying to access variables from one site to the next, just a means to load a userscript on a site without having to use a bookmarklet.
For a real test:
Visit: firsttaste.kraftcanada.com.
Open the javascript console and then enter: nitroWidget.loadScript("https://dl.dropboxusercontent.com/s/fcfbpfdmzrxywh9/mwolfe_alert.js")
This will execute the mwolfe_alert.js which merely contains an alert message.
Is there a way that I could create a clickable link on a site outside of *.kraftcanada.com which would create a popup/new tab that upon the {document,window,$}.onload/read would invoke the nitroWidget.loadScript?
Related
I'd like to be able to manually select text from cross-domain iframe with javascript on the frontend.
I know it's pretty difficult to achieve such result as the use of postMessage is required if I decided to use a 100% javascript solution. I'm opened to backend solutions (either php or nodejs)
Optimizely can access any dom element from the page, I'd like to understand how they are doing it. Is it because the user needs to install a widget on his website first? If yes, how does it works exactly?
Here's an example:
Reproduced from #2 of this answer:
Let's say you want to create an experiment on http://www.mypage.com ... The Optimizely Editor loads http://www.mypage.com inside an iframe and uses window.postMessage to communicate with the page. This only works if that page already has a snippet like [<script src="//cdn.optimizely.com/js/XXXXXX.js"></script>] on it. If that's not the case, the editor will timeout while waiting for a message from the iframe'd page, and will load it again via a proxy that actually inserts the snippet onto the page. This loading process allows the editor to work with pages that a. contain an account snippet b. do not contain an account snippet, or c. sit behind a firewall (c. requires the snippet.)
I have a legacy web application that we are not allowed to modify yet. We need to add a new function to the application in the short term. We have been told that we may modify the webpage with any local scripts we want but we have to wait 4 months before they will unlock the application.
So my goal is to create a webpage locally, click on that local html file and have it open the url for the legacy application, and then inject the new JavaScript function to the application.
On "your" page, use an iFrame to "import" the page you cannot edit, on your page add whatever modifications you need/want.
If there is no server side scripting on the page, then copy the page source to your page, and add whatever you want to it. It is difficult to give you a focused answer without having access to or more information about the actual legacy page.
It can't be done directly since browsers prevent cross site scripting so injecting js from local machine will complain with same origin errors the only workaround i know is to use developer tools and open console then you can type your JavaScript there and run it directly
I want my webpage to have two parts. The top part has a textbox. When the user types a URL into the textbox, the bottom part browses to the content of that URL. When the user clicks a link within the bottom part, the bottom part navigates to the new URL, and the textbox in the top part changes to the new URL. How can I do it?
NOTE: This behavior is the same as in Google Translate (e.g. here), but without any translation.
first problem..
Same origin issue
The only way to achieve what you are asking is exactly the way google translate does what it does - which is to use a server-side powered script as a proxy request:
http://translate.google.com/translate_un?depth=1&hl=en&ie=UTF8&prev=_t&rurl=translate.google.com&sl=auto&tl=en&twu=1&u=http://de.wikipedia.org/wiki/USA&lang=de&usg=ALkJrhgoLkbUGvOPUCHoNZIkVcMQpXhxZg
The above is the URL taken from the iframe that Google translate uses to display the translated page. The main thing to note is that the domain part of the URL is the same as the parent page's URL http://translate.google.com -- if both your frame and your parent window do not share the same domain, then your parent window's JavaScript wont be able to access anything within the iframe. It will be blocked by your browser's in-built security.
Obviously the above wont be a problem if in your project you are only ever going to be navigating your own pages (on the same domain), but considering you are proffering Google Translate as an example I'm assuming not.
What would Google do?
What the above URL does is to ask the server-side to fetch the wikipedia page and return it so that the iframe can display it - but to the iframe this page appears to be hosted on translate.google.com rather than wikipedia. This means that the iframe stays within the same origin as the parent window, and means that JavaScript can be used to edit or modify the page within the iframe.
next problem....
Rewrite the proxied content
Basically what I'm saying is that this can't be achieved with just HTML and client-side JavaScript - you need to have something to help from the server-side i.e. PHP, Python, Ruby, Lisp, Node.. and so on. This script will be responsible for making sure the proxied page appears/renders correctly e.g. you will have to make sure relative links to content/images/css on the original server are not broken (you can use the base tag or physically rewrite relative links). There are also many sites that would see this as an illegal use of their site, as per their site's terms of use and so should be black listed from your service.
final problem..?
Prevent the user from breaking away from your proxy
Once you have your proxy script, you can then use an iframe (please avoid using old framesets), and a bit of JavaScript magic that onload or ondomready of the iframe rewrites all of the links, forms and buttons in the page. This is so that when clicked or submitted, they post to your proxy script rather than the original destination. This rewrite code would also have to send the original destination to your proxy script some how - like u in the Google translate URL. Once you've sorted this, it will mean your iframe will reload with the new destination content, but - all importantly - your iframe will stay on the same domain.
too many problems!
If it were me, personally, I'd rethink your strategy
Overall this is not a simple task, and it isn't 100% fullproof either because there are many things that will cause problems:
Certain sites are designed to break out of frames.
There are ways a user can navigate from a page that can not be easily rewritten i.e. any navigation powered by JavaScript.
Certain pages are designed to break when served up from the wrong host.
Sites that do this kind of 'proxying' of other websites can get into hot water with regards to copyright and usage.
The reason why Google can do it is because they have a lot of time, money and resources... oh and a great deal of what Google translate does is actually handled on the server-side - not in JavaScript.
suggestions
If you are looking for tracking users navigating through your own site:
Use Google Analytics.
Or implement a simple server-side tracking system using cookies.
If you are looking to track users coming to your site and then travelling on to the rest of the world wide web:
Give up, web technologies are designed to prevent things like this.
Or join an online marketing company, they do their best to get around the prevention of things like this.
add a javascript function to your second frame -
<frame id="dataframe" src="frame_a.htm" onload="load()">
let the text box have an id - say "test"
function load()
{
document.getElementById('test').value=document.getElementById('dataframe').src
}
Recently, a few developers have started creating apps which do nothing more than point at state-owned content (free, public property) through UIWebViews. This wouldn't ordinarily be a problem, except the apps are all ad-supported and some are even paid. Essentially, they're making money on state-owned content.
My question is this: how can I force the site to open a new Safari window rather than display in the UIWebview (which is wrapped in their app's branding)? I am able to detect UIWebview using the following, but am unable to do anything besides simply hide the content. I'd prefer it to provide a link to our content which then opens in Safari.
This is how I'm detecting UIWebview:
var is_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(navigator.userAgent);
unfortunately its fairly trivial for a developer to force the User-Agent string to anything they want, so your attempts to thwart these developers might only be temporary. You can't force your content to be viewed in a browser. A user could use a tool like CURL to view your content also...
Once you detect that you're in the UIWebview, you need to fire a window.open() to put your content in a fresh window.
This talks about some quirks that make it a little tricky (but not impossible): Opening popup links in UIWebview. Note that the question there is the reverse of yours, but the accepted answer does show how to get UIWebview to pop a new window via Javascript.
This has been a concern ever since the Web began. You can't stop people from scraping your content, but you can make it hard to reframe it.
Edited to add
Unfortunately for you, the app can intercept window.open(): UIWebView respond to Javascript calls
I suppose you could always give up and show a banner that says something like "you paid for this data with your taxes, you shouldn't pay for it again with ads. Just open a browser and go to ... "
You can find out if it is a WebView or Mobile Safari, as seen in this thread. The problem is, that you could only open Safari via a custom URL scheme, but think, only http://, https:// etc. work. Even if there would be something like safari-http://, the programmers of the apps with the UIWebView could catch that request and redirect it back into the web view. So, I'm sorry to say: That's not possible.
I'm trying to open another website and pull out a list of usernames on that site to send a message to. Specifically, I'm talking about XBOX Live previous players - this requires a login through a https:// website and so an iFrame so that Javascript can reference this cannot be used.
I have looked at JavaScript HTML DOM Examples but none of them seem to be what I need.
How do I create a NEW window in Javascript and access the elements of that window?
You can see my previous post here where I was attempting to do this with VBScript (an appalling idea really). Show me how I can perform the same with pure Javascript! :)
If the window is in a different domain, JavaScript can not access it because of the same origin policy. So for the same reason you can not do it with an iframe, you can not do it with a pop up window.