以下是一个简单的 JSONP 请求的步骤和示例：
步骤：
1. 定义一个回调函数： 在客户端定义一个全局的 JavaScript 函数，该函数将在数据加载完成时被调用。
2. 创建 <script> 标签： 通过 JavaScript 动态创建一个 <script> 标签，并将其 src 属性设置为带有回调函数的外部数据源的 URL。
3. 服务器返回数据： 服务器端接收到请求后，将数据包装在回调函数中返回。
4. 客户端处理数据： 当 <script> 标签加载完数据后，回调函数将被调用，客户端可以在这个函数中处理获取到的数据。
示例：
假设有一个跨域的数据源 https://api.example.com/data 返回如下数据：
{"name": "John", "age": 30, "city": "New York"}
以下是一个简单的 JSONP 请求的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSONP Example</title>
</head>
<body>
<script>
// 步骤 1：定义回调函数
function handleData(data) {
console.log("Received data:", data);
}
// 步骤 2：创建 <script> 标签
var script = document.createElement('script');
// 步骤 3：设置 <script> 标签的 src 属性，包括回调函数
script.src = 'https://api.example.com/data?callback=handleData';
// 步骤 4：将 <script> 标签添加到页面
document.body.appendChild(script);
</script>
</body>
</html>
在这个例子中，handleData 函数将在数据加载完成时被调用，输出接收到的数据。
需要注意的是，服务器端的 API 必须支持 JSONP，即在请求中包含回调函数名，并将数据包装在这个函数中返回。例如，在服务器端处理请求时，如果请求参数中包含 callback，则将数据包装在这个回调函数中返回。
转载请注明出处：http://www.zyzy.cn/article/detail/13196/JSON