如何使用 jsonp 来提醒整个 html 代码？答案

【问题标题】：How to use jsonp to alert a entire html code?如何使用 jsonp 来提醒整个 html 代码？
【发布时间】：2016-11-17 05:07:11
【问题描述】：

我使用跨域 ajax 获取整个 html 页面代码，但它总是响应失败的按摩。

consolelog: " Uncaught SyntaxError: Unexpected token

这是我的 ajax 函数。

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”的方法来解决这个问题。

任何人有任何答案请告诉我，谢谢很多

!!更新！！

我使用代理解决了这个问题。

首先你必须创建一个代理文件，我以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(){
	$.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>

这似乎工作！但是我遇到了一个新问题。这似乎是来自谷歌服务器的错误。我无法使用 ajax 访问 google imagesearch，它会响应 403error 或 302 move。

302 moved screen shot

403error screen shot

PS.也许我需要一个 google API 或我丢失的任何代码来添加？

谢谢大家:)

【问题讨论】：

把你的成功函数改成这个，让我知道会发生什么：成功：函数（数据）{警报（数据）； },
jsonpurl + '?callback=anycallbackfunction'
@Jay 没用 :'(
@B.Kocaman 我不能使用它，因为当我使用 may 函数时它已经发送了一个回调 url
喜欢“google.com/…”

标签： javascript php html ajax jsp

【解决方案1】：

您不能使用 JSONP 以这种方式加载 HTML 数据。 JSONP 将数据加载到当前脚本标签中，因此它期望将检索到的数据作为 javascript 执行；这就是为什么您会收到 Uncaught SyntaxError: Unexpected token < 这可能与检索到的页面开头的 doctype 声明有关，无法将其评估为 javascript 代码。

因此，如果您需要以这种方式加载 HTML 数据，您首先需要修改服务器响应以将 HTML 封装为 javascript 有效结构（可以是 json 对象或以 HTML 作为参数的函数调用或任何其他有效的js方式）。

编辑：我已经看到您提出的代理脚本和重定向问题的更新问题。 file_get_contents 函数不应该支持重定向，请改用 cURL：

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

【讨论】：

哦，我忘记了PS. I don't want to use "Access-Control-Allow-Origin" method to solved this problem.，抱歉，这确实是您问题的解决方案。 ;)
谢谢你的帮助：)，顺便问一下，jsp上的“Access-Control-Allow-Origin”应该如何使用？添加一个jsp响应？我昨天在“www.goole.com”上尝试过这种方式，但似乎没有用:'(

【解决方案2】：

ajax url 添加一些这样的文本：?callback=?，然后服务器必须响应这样的文本：fnName({json data}).jquery 将自动翻译'？'到定义的函数名。服务器获取函数名，然后导出。

【讨论】：

我知道，但也许有一些方法可以解决我的问题。喜欢我的新更新，谢谢你的回答：）顺便说一句，我现在有一个新问题......：'（