Print JavaScript code from external file - javascript

I am trying to understand how to include JavaScript externally so the code prints to the page.
When I insert the JavaScript directly into the page code, it prints "hello"
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">document.write("hello");</script>
</body>
</html>
However, when I put that same code into external file say "javascript.js" and include it (src) in the html it does not print "hello"?
<html>
<head>
<title></title>
<script type="text/javascript" src="http://thewebsite.com/javascript.js"></script>
</head>
<body>
</body>
</html>
I am trying to understand how to get that external JavaScript file to run and print "hello".
How does XSS work then if a hacker was to include the following tag inside say a textarea to call his malicious script from malicious server?
<script type="text/javascript" src="http://thewebsite.com/javascript.js"></script>
Heres whats in the "javascript.js" file:
<script type="text/javascript">
document.write("hello");
</script>
The file is on the same domain so Same Origin Policy should not apply here and as mentioned if I directly insert code it does work but not when I try to include as separate file.
I thought including JavaScript as external file, should print the contents of the external file (i.e. "hello" in this case) as if it was directly inserted in html page?

When I insert the JavaScript directly into the page code, it prints "hello"
Correct
However, when I put that same code into external file say "javascript.js" and include it (src) in the html it does not print "hello"?
If the content isn't being written then, presumably, an error is being thrown instead. Check the error console for your browser.
The problem is that you are including the HTML script tags in the JavaScript file. JavaScript files should contain only JavaScript.
The file is on the same domain so Same Origin Policy should not apply here
It doesn't. The Same Origin Policy just prevents JavaScript running (not loaded from) Origin A from reading data from Origin B. Since the data is included in the script itself, it would still be available, even if the script was loaded from Origin B.

I guess there is a policy enforced by browsers called Same Origin Policy which makes sure that JS from different domains does not access each others data when loaded in a single page. Lets say that you have a Google Ad and it has some Javascript in it. It wouldn't be advisable if the script in Google Ads be able to access the data in your site (Vice-Versa but ofcourse you always have Google Ads or the Like button as iFrame and hence anyways they are most neatly seperated.)
If you could load the js file as a src to image file then I suppose you can achieve what you intend to.(If I am not wrong.)
Edit: The javascript file cannot be given as input to the src of img tag. You can only use it as javascript: scheme.

Related

Phantomjs: Modifying html dom before opening it as webpage

I need to process html files that have corrupted script files that are added to it via tag.
Im planning to remove all script tag present in the webpage via phantomjs.
But on opening the webpage via webpage.open(), phantomjs parse error is thrown since it cannot parse the JS content within the script tag.
Here is an example:
<html>
<head>
<script>
corrupted JS
if(dadadd
;
</script>
<body>
some content
</body>
</html>
Can someone help me on suggesting the right way to clean this webpage using phantomjs ?
It's not (easily) possible. You could download (not through opening the page, but rather making an Ajax request in page.evaluate()) the static html, then change according to your needs, then assign it to page.content.
This still might not work, because as soon as you assign it to page.content, you're saying that PhantomJS should interpret this source as a page from an unknown domain (about:blank). Since the page source contains all kinds of links/scripts/stylesheets without a domain name, you'll have to change those too in order for the page to successfully load all kinds of resources.
It might be easier to just have a proxy between PhantomJS and the internet with a custom rule to adjust the page source to your needs.

Javascript doesn't work if I invoke it as URL

I want to run a Javascript file in my page. If I embed it as a script inside of the HTML, it works. I mean, the following code works fine:
<html>
<script>
...
</script>
</html>
But when I reference an URL source (with the src attribute), it doesn't work:
<html>
<script type="text/javascript"
src="https://s3-sa-east-1.amazonaws.com/XXXXX/myJavascript.js">
</script>
</html>
When I put the URL in my browser, the code is displayed.
EDIT: Do I need some especial configuration in the Amazon S3 Servers in order to work with my Javascript files??? I just uploaded it and marked it as public resources, but I did nothing more.

Is it possible to get the text of a script that is loaded from a source as opposed to in line code?

Currently I'm just taking source of a script that is on the page.
The HTML:
<script type="text/plain">meow</script>
The JavaScript:
// returns "meow"
document.querySelector('script').text
I want to be able to load the script from another file.
The HTML:
<script type="text/plain" src="file.txt"></script>
file.txt:
meow
The JavaScript:
// returns "meow"
document.querySelector('script').textFromFile
Does anyone know if that's possible? I would assume it's not, and I haven't found anything on google that is what I'm asking.
If the script has a src attribute you would need to fire of a request via XHR to that same path and pull in the text content of its response. Keep in mind this will require additional work if the script is being loaded from another domain. At that point you would need to make use of CORS, or introduce some other type of proxy to handle the cross-domain communication.

HTML & Javascript - Including a javascript on all the websites in a domain

Can you add the javascript in the desired *.html files without including in each of the *.html files? Like:
<html>
<head>
......<!-- no script-->
</head>
<body>
......<!-- also no script tags-->
</body>
</html>
So can I use a method that will automatically include my desired javascript file in my any future desired *.html files without manually adding <script> tags in my html files? Just like htaccess that will redirect all mis-leading urls in a domain to a 404 page.
Please tell me if I need to add any information.
*edit - I don't want to use iframe
Well the concept you're talking about is basically php templating.
You can make a single header and footer, and then all you have to change is the body. The header and footer gets included with the page server side.
Besides that there is probably some kind of automated program that can do it auto-manually.

Is external JavaScript source available to scripting context inside HTML page?

When an external JavaScript file is referenced,
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
is the JavaScript source (lines of code before interpretation) available from the DOM or window context in the current HTML page? I mean by using only standard JavaScript without any installed components or tools.
I know tools like Firebug trace into external source but it's installed on the platform and likely has special ability outside the context of the browser sandbox.
Nope. There's no Javascript API for loading the true content of <script> tags. This is actually not an oversight, but rather a security feature: suppose I request the .json file that Gmail requests via AJAX to load your inbox by putting it in an external <script> tag. A JSON document is valid Javascript (granted, without side-effects), so it would run without error. Then, if I could inspect the content of the external script, I would be able to read your e-mail. (I'm almost certain that Gmail is more complex than that, but most sites are not.)
So, making up a few things about how Gmail works, here's how the attack would look:
<script id="inbox" type="text/javascript" src="http://mail.google.com/OMGYOURINBOX.json"></script>
<script type="text/javascript">
// Supposing a value called `externalScriptContent` existed on a script tag:
var inboxJSON = document.getElementById('inbox').externalScriptContent;
var messages = JSON.parse(inboxJSON);
for(var i in messages) {
// Do something malicious with each e-mail message
alert(messages[i].body);
}
</script>
If a script tag had the value externalScriptContent, I could just put whatever URL in for the src that I wanted, and then summon up the remote file's contents, effectively circumventing AJAX cross-origin restrictions. That'd be bad. We allow cross-origin requests for remote scripts because they are run and run only. They cannot be read.
Firebug has these permissions because Firefox extensions have the ability to inspect anything that the browser requests; normal pages, thankfully, do not.
However! Bear in mind that, if the script is on your domain, instead of writing it in <script src="…"></script> form, you can pull it up with an AJAX request then eval it to have access to the contents and still only request it once :)
You can parse the <script> tag and re-request the js file by XMLHttpRequest, it will likely be readily served from cache and with credentials of the current page. But unless both your requesting script and the script in the tag originate from the same domain, the browser will disallow this.

Categories