Loading an XML locally into JavaScript without having a web server available? - javascript

I've made an script for processing XML:
Extracts parts of the XML-data and displays them on a HTML-/CSS-page.
Currently I use the stringified content of some arbitrary file for doing my development. Written as a string-literal into my JavaScript.
Works great. But now comes the problem:
Of course I would like to load whatever (equal-structured) XML-files. Instead of having it in my code as a string-literal.
Normally I would load the files into my script via Ajax.
But I can't install a web-server on these computer.
I'm within an enterprise and it isn't possible to install any additional software. Restricted via group-policies etc. No chance. Forget it!
As far as I know it isn't possible to use Ajax without a web-server because Ajax communicates via the http-protocol.
So here's my questions:
I there (perhaps) a possibility to use Ajax without a web-server?
And in case of impossible:
Have I got any Ajax-alternatives to load XML-data into my script?

You can embed your xml inside script tag in your html like this:
console.log(document.getElementById('file').innerHTML)
<script type="text/xml" id="file">
<root><foo><bar></bar></foo></root>
</script>

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 not working in apache-served html

I set up an apache server on gentoo, I want to be able to run javascript code in my html files served by apache.
If I manually open up the html file that lives on the apache server in Chrome, the javascript works fine. If I browse to the html file using the server address via apache, it does not execute. This is my test html, it's very simple:
<html>
<h2>js test</h2>
<script>
alert("Hey");
</script>
</html>
I haven't ever seen this behavior before. Any ideas?
EDIT:
What I mean by opening manually and using the server address is this:
file:///mnt/server/path/to/file.html (opening manually)
http://server/path/to/file.html (browsing to apache server)
EDIT 2:
No errors in apache's error_log. At first I was using jquery to try to do some ajax stuff, but I tried to simplify everything to the max for this question.
As pointed out by #Blender, the HTML is missing the typical head.../head and body.../body sections. Maybe this matters in the HTML loading properly and the browser triggering the script portions.
Also, pop ups like alert() can be blocked by pop up blockers in the browser that can differentiate a site vs a file url.

Is it possible to load in a local version of a JavaScript file instead of the server version?

Just had a quick question to throw out and see if there was a solution for this...
Let's pretend I have no access to the server.
I load up a webpage and find out that they have a Javascript file loading from a subfolder (let's say /scripts/js/some.js)
Now, I want to make changes to this file locally and test it against the whole site without downloading the entire site to a local folder.
Does anyone know of a way I can override the loading of that remote js file in favor of a local/edited copy of it?
Try using noscript or adblock to block the server side script from loading. Then use greasemonkey to load your own script.
I actually found a solution for this. Posting details for anyone that comes here looking for it.
Privoxy (www.privoxy.org/) [Free] Allows this for the most part through a redirect. Though Firefox may block the redirect depending on where you put it. This means you most likely will not be able to save the file locally and reference it via file://etc/
( I wish I had a way to tell you how to statically fiddle with JavaScript on web pages you have limited access to... but I have not found it. If an answer comes along I will accept it over this. )
Of course, you have to set up Privoxy, and use it as a local proxy server. It's pretty simple if you only use it temporarily: Just point your browser to proxy 127.0.0.1 on port 8118 with it running.
You have to add a redirect "default action" (Options > Edit Default Actions) to redirect the browser to use your new copy:
{ +redirect{/newLocation/some.js} }
/scripts/js/some.js
If you want a way to use a local file instead of a remote file (in any web browser), I highly recommend Charles Web Proxy. http://www.charlesproxy.com/
In Charles, go to the Tools menu and select Map Local. Add a new mapping by entering the address of the file on the web you would like loaded from your disk.
This technique will for all sorts of files (JavaScript, CSS, SWF). Of course you have the option to temporarily disable this feature, and it will only work while Charles is running. Very handy.
While your solution with proxy is somewhat more permanent, I found that with Fiddler you can do it with almost no configuration:
How to replace Javascript of production website with local Javascript?
In a browser that supports FileReader such as Chrome, yes, in combination with 'eval' to execute arbitrary JS. In your HTML add a button for the user to press:
<form>
<input type="file" name="file"
onchange="loadJS(event.target.files);">
</form>
In your scripts add:
function load() {
var reader = new FileReader();
reader.onload = function(evt) {
eval(evt.target.result);
};
reader.readAsText(files[0]);
}

How can you retrieve a pages source code (after javascript has ran) using PHP?

On my page, javascript adds a lot of classes on page load (depending on the page).
How can I wait til javascript has added those classes, then get the HTML using either Javascript or PHP from a different file?
When the page has finished loading, POST the rendered source back to a PHP script using Ajax.
$(function()
{
var data = $('body').html();
$.post('/path/to/php/script', data);
});
(This example assumes you're using jQuery)
It looks like what you need is Firebug. If you are using Google Chrome, you could also use the Google Chrome Developer Tools.
These tools will allow you to view the live DOM of the page as well as track any changes made by your javascript. Tools like these are essential to us as developers.
You can not receive the rendered HTML source by an other resource other than from JavaScript on your page itself. After JS finished all the content changes in the HTML, you could post the HTML source to a PHP on the server and save it.
Pseudo code:
// JavaScript using jQuery
setTimeout("jQuery.post('/catch.php', jQuery(document));", 2000);
// on the server side create a catch.php file
<?php
file_put_contents('./tmp.txt', 'php://input');
You can't, easily.
JavaScript modifies the DOM in memory. This is completely separate entity than the "source" you originally sent to the browser.
The closest thing you can do is build an XML representation of the DOM via JS and send it back to the server via AJAX. Why you would want/need to do this is beyond me.
Open your Bookmarks/Favorites and create a new one with this and then click it after your page loads:
javascript:IHtml=document.documentElement.innerHTML;
LThan=String.fromCharCode(60);
LT=new RegExp(LThan,'g');
IHtml=IHtml.replace(LT,'<');
IHtml=IHtml.replace(/ /g,' ');Out ='';Out+='<!DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN"';Out+=' "http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd">';
Out+='<html xmlns="http:\/\/www.w3.org\/1999\/xhtml" xml:lang="en-US" lang="en-US">';
Out+='<head><title>Inner HTML<\/title><\/head>';
Out+='<body style="color:black;background-color:#ffffee;">';
Out+='Body HTML:<br \/><ul>';
NLine=String.fromCharCode(10);
ILines=IHtml.split(NLine);
for (ix1=0; ix1< ILines.length; ix1++) {
Out+='<li>'+ILines[ix1]+'<\/li>';
}
Out+='<\/ul>';
Out+=' [<a href="javascript:void(0);" onclick="window.close();" title="close">Close<\/a>]';
Out+='<\/body><\/html>\n';
PopUp1=window.open('','IHTML');
PopUp1.document.write(Out);
PopUp1.document.close();

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