什么是JSONP，为什么创建它？
我了解JSON，但不了解JSONP。Wikipedia上有关JSON的文档是JSONP的最高搜索结果。它说：
JSONP或“带填充的JSON”是JSON扩展，其中将前缀指定为调用本身的输入参数。
?？什么电话 这对我来说毫无意义。JSON是一种数据格式。没有电话
JSONP是脚本标记注入，它将响应从服务器传递到用户指定的函数。
我可以理解，但这仍然没有任何意义。
那么什么是JSONP？为什么创建它（它解决了什么问题）？我为什么要使用它？
附录：我刚刚在Wikipedia 上为JSONP创建了一个新页面。现在，基于jvenema的答案，它对 JSONP有了清晰而透彻的描述。
第204篇《什么是JSONP，为什么创建它？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
在理解JSONP之前，您需要了解JSON格式和XML。当前，Web上最常用的数据格式是XML，但是XML非常复杂。这使用户不方便处理嵌入在Web页中的内容。
为了使JavaScript可以轻松地交换数据，甚至作为数据处理程序，我们根据JavaScript对象使用措辞，并开发了一种简单的数据交换格式，即JSON。JSON可以用作数据或JavaScript程序。
JSON可以直接嵌入JavaScript中，使用它们可以直接执行某些JSON程序，但是由于安全性限制，浏览器沙箱机制会禁用跨域JSON代码执行。
为了使JSON在执行后可以传递，我们开发了JSONP。JSONP通过JavaScript回调功能和<script>标签绕过了浏览器的安全限制。
简而言之，它解释了什么是JSONP，解决了什么问题（何时使用）。
因为您可以要求服务器将前缀附加到返回的JSON对象。例如
function_prefix(json_object);
为了使浏览器eval“内联” JSON字符串作为表达式。此技巧使服务器可以直接在客户端浏览器中“注入” JavaScript代码，而绕过“相同来源”限制。
换句话说，您可以进行跨域数据交换。
通常，XMLHttpRequest不允许直接跨域数据交换（需要通过同一域中的服务器），而：
<script src="some_other_domain/some_data.js&prefix=function_prefix>`可以从不同于源的域访问数据。
同样值得注意的是：即使在尝试这种“技巧”之前，应将服务器视为“受信任的”服务器，也可以包含对象格式等可能发生变化的副作用。如果一个function_prefix（即适当的js函数）用于接收JSON对象，则该函数可以在接受/进一步处理返回的数据之前执行检查。
JSONP通过构造一个“脚本”元素（以HTML标记或通过JavaScript插入DOM）来工作，该元素请求到远程数据服务位置。响应是使用预定义函数的名称以及传递的参数（即请求的JSON数据）加载到浏览器上的JavaScript。执行脚本时，该函数将与JSON数据一起调用，从而允许请求页面接收和处理数据。
有关进一步的阅读访问， 请访问：https : //blogs.sap.com/2013/07/15/secret-behind-jsonp/
客户端代码段
<!DOCTYPE html>
<html lang="en">
<head>
<title>AvLabz - CORS : The Secrets Behind JSONP </title>
<meta charset="UTF-8" />
</head>
<body>
<input type="text" id="username" placeholder="Enter Your Name"/>
<button type="submit" onclick="sendRequest()"> Send Request to Server </button>
<script>
"use strict";
//Construct the script tag at Runtime
function requestServerCall(url) {
var head = document.head;
var script = document.createElement("script");
script.setAttribute("src", url);
head.appendChild(script);
head.removeChild(script);
}
//Predefined callback function
function jsonpCallback(data) {
alert(data.message); // Response data from the server
}
//Reference to the input field
var username = document.getElementById("username");
//Send Request to Server
function sendRequest() {
// Edit with your Web Service URL
requestServerCall("http://localhost/PHP_Series/CORS/myService.php?callback=jsonpCallback&message="+username.value+"");
}
</script>
</body>
</html>
服务器端的一段PHP代码
<?php
header("Content-Type: application/javascript");
$callback = $_GET["callback"];
$message = $_GET["message"]." you got a response from server yipeee!!!";
$jsonResponse = "{\"message\":\"" . $message . "\"}";
echo $callback . "(" . $jsonResponse . ")";
?>
相似问题
问题类别
这是该网站，上面有很多示例，其中包括从最简单的使用此技术到最先进的平面JavaScript的解释：
w3schools.com / JSONP
上面描述的我最喜欢的技术之一是Dynamic JSON Result，它允许将JSON发送到URL参数中的PHP文件，并允许PHP文件还根据获得的信息返回JSON对象。
jQuery之类的工具也具有使用JSONP的功能：