Very Basic HTML/javascript Question

TheSetMiner · 03-12-2013 1:08pm #1

Hey, so I am learning html and javascript just to get a fairly simple program online.

At the moment, all I am trying to do is to have a form on a webpage which allows the user to input a url address. Then the javascript gets the source code of the chosen url address and returns this to the user.
Can anyone tell me where I am going wrong. Bear in mind I have only just started with both html and javascript! Oh btw there is a bit of jquery in there!

<!DOCTYPE html>
<html>
<body>
<form>
url: <input type="text" name="url"><br>
</form>
<script src="jquery-1.10.2.js"></script>
<script>
var url = "url"
$.get(url, function (data) { 
        document.write("Page Source: " + data); 
    }); 
</script>

</body>
</html>

Appreciate all help!

colm_c · 03-12-2013 6:13pm

Can't do that with pure JS in a browser, as what you're talking about is cross domain ajax which isn't possible without CORS in place for each site for security reasons.

Have a look here:
http://enable-cors.org/

You could however setup a local proxy with node/nginx, and call a local service to get any domain you want.

TheSetMiner · 03-12-2013 6:37pm

colm_c wrote: »

Can't do that with pure JS in a browser, as what you're talking about is cross domain ajax which isn't possible without CORS in place for each site for security reasons.

Have a look here:
http://enable-cors.org/

You could however setup a local proxy with node/nginx, and call a local service to get any domain you want.

Thank you! That is helpful to know! So what exactly is CORS? is that another library like jquery? Sorry I am new to this, I'll read up on that link anyway!

And how would I go about setting up a local proxy with node/nginx? Is that a seperate approach to CORS? which do you recommend?

Thanks for replying!

Procasinator · 03-12-2013 6:57pm

Read about same-origin policy to get an idea of why you can't do what you wish to do (and how CORS comes into play):
http://en.wikipedia.org/wiki/Same_origin_policy

ChRoMe · 04-12-2013 12:58am

TheSetMiner wrote: »

Thank you! That is helpful to know! So what exactly is CORS? is that another library like jquery? Sorry I am new to this, I'll read up on that link anyway!

And how would I go about setting up a local proxy with node/nginx? Is that a seperate approach to CORS? which do you recommend?

Thanks for replying!

If you already have a backend, I'd imagine its simplier to just have PHP/ASP/Java /whatever to act as your proxy.

Overflow · 04-12-2013 11:03am

Short answer:
You cant make a http request via javascript to another website. Due to browser security restrictions. This can be enabled but would require the site your requesting to have CORS enabled.

Slightly longer answer:
Your best bet is to use a server side technology, such as ASP.NET or PHP. Your form would instead make an ajax request to your own server with the requested URL. Your serverside web application, acting as your proxy, then makes a request to the requested URL, downloads the source and returns it to the user.

TheSetMiner · 12-12-2013 3:52pm

For anyone wondering, I decided to develop a chrome extension instead as this allows for what I want to do. There seems to be no same-origin policy involved thankfully.
Thanks for everyones help

Very Basic HTML/javascript Question

Comments