0

Just to give a background. I wrote the below code in a normal html file. With no server or anything running on my system. I created a file on the desktop and wrote the html code in there.

First Method

<form action="http://www.google.com" method="GET">
<input type="submit"/>
</form>

Second Method

<form action="http://www.google.com" method="GET">
<input type="button" onclick="myMethod()"/>
</form>

<script>
function myMethod(){
                    $.ajax({
                        data:'',
                        type: 'GET',
                        url: 'http://www.google.com',
                        success: function(response){
                            $(".popupdiv").html(response);
                        }
                    });
                    event.preventDefault();
                    return false;
}

</script>

When I do the first method, on clicking the button, I get taken to the google.com but by second method, nothing happens. Even my (chrome)console does not show any error.

What is happening and what is the difference?

Kraken
  • 23,393
  • 37
  • 102
  • 162

2 Answers2

0

Even my (chrome)console does not show any error.

This seems unlikely.

Mine shows: Uncaught ReferenceError: $ is not defined

If I add jQuery, it shows: XMLHttpRequest cannot load http://www.google.com/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://run.jsbin.com' is therefore not allowed access.

Even if that wasn't the case, $(".popupdiv") won't match anything in your document.

What is happening and what is the difference?

In the one case, you are telling the user's browser to just go to Google.

In the other, you are telling the user's browser to fetch some data from Google and make it available to you. Since the content a website shows can depend on the browser sending credentials (in Google's case it actually does), this would be a serious security problem if it was possible.

See also: Ways to circumvent the same-origin policy.

Community
  • 1
  • 1
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • I am sorry, I did not understand your last sentence. ie "Since the content a website shows can depend on the browser sending credentials (in Google's case it actually does), this would be a serious security problem if it was possible.". Thanks. – Kraken Feb 07 '14 at 16:58
  • What if it was my bank's website, rather then Google. The information in my bank account is more obviously private then the information in Google. Would you like any website you visit to be able to instruct your browser to visit your bank's website and get your account details? – Quentin Feb 07 '14 at 17:02
  • So basically It checks for authentication and since it fails, I don't get anything. right? – Kraken Feb 07 '14 at 17:22
  • No, it checks to see if Google says that other sites are allowed to read data requested by the user, and that fails. – Quentin Feb 07 '14 at 19:17
0

the action normally sends you to it's value "mostly the name of a file or a url" but when you're using a get method this only send a request to load the data from the file or the url given, try your second code with an Xml or a Json file to understand it more.

Saïd Tahali
  • 189
  • 10