I use crossdomain ajax to get entire html page code ,but it always respone a failed massage.
consolelog: " Uncaught SyntaxError: Unexpected token < "
This is my ajax function.
function t(){
var url = document.getElementById("url").value;
$.ajax({
url: 'https://www.google.com/',
type: 'GET',
crossDomain: true,
data:'',
dataType: 'jsonp',
success: function() { alert("Success"); },
error: function() { alert('Failed!'); },
});
}
PS. I don't want to use "Access-Control-Allow-Origin" method to solved this problem.
anyone have any answer plz tell me,thx a lots
!!Update!!
I use proxy to solved this problem.
first you must create a proxy file, I use php to be a example.
proxy.php
<?php
$url ='https://www.google.com/searchbyimage?site=search&sa=X&image_url=http://kingofwallpapers.com/apple/apple-015.jpg';
if($_GET['uri']=='')
echo file_get_contents($url);
else
echo file_get_contents($_GET['uri']);
?>
test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
</head>
<script type="text/javascript">
//var NewArray = data.toString().split("=");
function t(){
$.get("proxy.php?uri=", function(data) {
alert(data);
x(data);
});
}
function x(data){
$.get("proxy.php?uri="+data.toString().split('"')[5], function(data2) {
alert("Data Loaded: " + data2);
});
}
</script>
<body onload="t()">
</body>
</html>
it's seems work!! But I get a new problem.It's seems error from google server. I can't use ajax to visit google imagesearch, it's will response a 403error or 302 moved.
PS.Maybe I need a google API or any code I lost to add?
thx everyone : )
</div>
You can't use JSONP to load HTML data in this way. JSONP loads data into the current script tag so it expects to execute the retrieved data as javascript; this is why you're getting the Uncaught SyntaxError: Unexpected token <
this is probably related to the doctype declaration at the start of the retrieved page that can't be evaluated as javascript code.
So if you need to load HTML data this way you first need to modify the server response to encapsulate the HTML into a javascript valid structure (can be a json object or a function call with the HTML as a paramenter or any other valid js way).
Edit: I've seen your update question with the proposed proxy script and the redirect problem. The file_get_contents
function is not supposed to support redirects, use cURL instead:
<?php
$url = 'https://www.google.com/searchbyimage?site=search&sa=X&image_url=http://kingofwallpapers.com/apple/apple-015.jpg';
if(isset($_GET['uri']) && '' !== $_GET['uri'])
{
$url = urldecode($_GET['uri']);
}
$curl = curl_init();
curl_setopt_array(
$curl,
[
CURLOPT_RETURNTRANSFER => 1,
CURLOPT_URL => $url,
CURLOPT_FOLLOWLOCATION => 1
]
);
$content = curl_exec($curl);
curl_close($curl);
echo $content;
?>
The ajax url add some text like this:?callback=?,then the server must response text like this: fnName({json data}).Jquery will automatic translate '?' to a defined function name.The server get the function name, then export.