2016-07-14 2 views
0

크로스 도메인 아약스를 사용하여 전체 HTML 페이지 코드를 가져 오지만 항상 실패한 마사지를 회상합니다.jsonp를 사용하여 전체 html 코드를 경고하는 방법?

consolelog : "catch되지 않은 구문 에러 : 예기치 않은 토큰 <"

이 내 아약스 기능입니다.

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. 이 문제를 해결하기 위해 "Access-Control-Allow-Origin"방법을 사용하고 싶지 않습니다.

누구나 답변 해주세요. plz 내게 말해주세요.

!! 업데이트 !!

프록시를 사용하여이 문제를 해결했습니다.

먼저 프록시 파일을 만들어야합니다. 예를 들어 PHP를 사용합니다.

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(){ 
 
\t $.get("proxy.php?uri=", function(data) { 
 
\t alert(data); 
 
\t x(data); 
 
\t }); \t 
 
} 
 

 
function x(data){ 
 
\t $.get("proxy.php?uri="+data.toString().split('"')[5], function(data2) { 
 
\t alert("Data Loaded: " + data2); 
 
\t }); 
 
} 
 
</script> 
 
<body onload="t()"> 
 
</body> 
 
</html>
그것의

작업 보인다! 하지만 새로운 문제가 발생했습니다. Google 서버에서 오류가 발생했습니다. Google 이미지 검색을 방문하는 데 아약스를 사용할 수 없습니다. 403 오류 또는 302 응답이 응답합니다.

302 moved screen shot

403error screen shot

PS.Maybe 나는 구글 API 또는 I 추가 손실 코드를 필요하십니까?

들으 모두 :)

+0

성공 함수를 다음과 같이 변경하고 어떤 일이 발생했는지 알려주세요. success : function (data) {alert (data); }, – Jay

+0

jsonpurl + '? callback = anycallbackfunction' –

+0

@Jay 작동하지 않았습니다. '( – MIKE

답변

1

는이 방법으로 HTML 데이터를로드 JSONP를 사용할 수 없습니다. JSONP는 현재 스크립트 태그에 데이터를로드하므로 검색된 데이터를 javascript로 실행해야합니다. 이것이 Uncaught SyntaxError: Unexpected token <이되는 이유는 아마도 자바 스크립트 코드로 평가할 수없는 검색된 페이지의 시작 부분에있는 doctype 선언과 관련이있을 것입니다.

이렇게 HTML 데이터를로드해야하는 경우 먼저 자바 스크립트 유효 구조로 HTML을 캡슐화하기 위해 서버 응답을 수정해야합니다 (json 객체 또는 HTML을 매개 변수로 사용하거나 다른 함수 호출 일 수 있음). 유효한 js 방법).

편집 : 제안 된 프록시 스크립트 및 리디렉션 문제로 업데이트 질문을 보았습니다. 은 file_get_contents 기능을 대신 컬을, 리디렉션을 지원하는 사용 안된다? 콜백 =?이 같은 다음 서버 반드시 응답 텍스트 : fnName ({JSON 데이터

<?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; 
?> 
+1

아, 잊어 버렸어."이 문제를 해결하기 위해 "Access-Control-Allow-Origin"방법을 사용하고 싶지 않습니다. ", 미안하지만 이것은 정말로 당신의 문제에 대한 해결책입니다;) –

+0

도움을 주셔서 감사합니다 :), 그런데 어떻게 "Access-Control-Allow-Origin"을 jsp에 사용해야합니까? jsp 응답을 추가 하시겠습니까? 어제 "www.goole.com"에서 그런 식으로 시도했지만 작동하지 않는 것 같습니다. '( – MIKE

0

는 아약스의 URL은 다음과 같이 텍스트를 추가 Jquery는 자동으로 '?'를 번역합니다. 서버는 함수 이름을 얻은 다음 내보내기를 수행합니다.

+0

그럴 수도 있지만 어쩌면 내 문제를 해결할 수있는 방법이있을 수 있습니다. :) 그런데, 나는 지금 새로운 문제가있다 ... : '( – MIKE

관련 문제