前言

因为浏览器同源策略的限制，无法向非同源地址发送 AJAX 请求（可以发送，但浏览器会拒绝接受响应）。

“同源”指的是“三个相同”：协议相同、域名相同、端口相同。

需求分析

我们需要在目标网站（需要统计的网站）引入我们的JS脚本，在这个脚本中我们会对需要的数据做一下收集。然后把数据发送给统计系统。

但是作为统计系统（如百度、CNZZ等）和要统计的网站肯定是不同源的，所以就会有同源限制，无法发送AJAX请求。那应该如何把统计到的数据跨域发送给统计系统呢？那就可以使用JSONP技术了。

jsonp是一种跨域解决方案，而不是一种技术。
因为img、link、script是不受“同源策略”限制的，所以我们可以利用这些标签去发送一个get请求。> JSONP只支持GET请求，不支持POST请求。

具体代码

前端代码如下：

创建一个script标签，把获取的数据拼接到src中，以get方式发送给后台接口。然后把script标签插入页面。

var isbaidu = 0; // 百度链接的类型，定义为：1为百度广告位链接，2为百度优化链接
var wd = ""; // 用户在百度搜索的关键词
var parentURL=""; // 进入本网站前的URL地址(在这里指的是从百度跳转到同网站的地址，这个链接中可以获取到我们需要的信息)


// 百度广告位链接
if (parentURL.indexOf("baidu.com/baidu.php") != -1) {
    isbaidu=1;
}else if (parentURL.indexOf("baidu.com/link") != -1){
    isbaidu=2;
}

// 获取百度的地址URL
try{if(opener.document.referrer.length>0){parentURL=opener.document.referrer;}}catch(e){parentURL=document.referrer;}
parentURL = parentURL.toLowerCase();

// 获取用户搜索关键词
arr = parentURL.split("?");
arrurl = arr[1].split("&");
for (i = 0; i <= arrurl.length - 1; i++) {
  arr2 = arrurl[i].split("=");
  for (j = 0; j <= arr2.length - 1; j++) {
    if (arr2[0] == "wd" || arr2[0] == "word") {
      wd = arr2[1];
    }
  }
}

//直接进来才是空的，如果不为空则是刷新操作。过滤过刷新导致的无用数据
if (window.name == "") { 
    if(isbaidu){
    /**JSONP核心代码**/
    // 把要发送的数据拼接到scr地址上，以get方式发送给后台

    // 【如果需要获取后台返回的数据，则需要定义一个回调数据来处理数据】
    // callback定义了一个回调函数名，后台输出一个函数调用，格式如：回调函数(返回数据)，直接把数据作为回调函数的实参传递回来。
    // 前端直接定义这个回调，然后形参就是后台传递回来的数据

        var JSONP=document.createElement("script");
        JSONP.type="text/javascript";  
        JSONP.src="http://www.jk1201.com/getinfo.php?callback=jsonpCallback&itemid="+_item_id+"&isbaidu="+isbaidu+"&wd="+wd;
        document.getElementsByTagName("head")[0].appendChild(JSONP);
    }
}
window.name = "frombaidu"; // 刷新当前页面，window.name并不会销毁

// 如果只是为了统计信息才不需要这个回调函数，只有需要获取后台返回的数据时才会使用这个回调数据获取数据。
function jsonpCallback(result){
  // 前端就可以根据后台返回的数据（result）来作相应的操作了。
    console.log(result)
}

后台代码（这里是php代码）如下：

<?php

// ...
// 一顿操作猛如虎，处理数据并获取需要回传到前端的数据result = 'abc'

//动态执行回调函数callback=_GET['callback'];
echocallback."($result)";

?>

最终get请求会在页面返回输出 jsonpCallback('abc'),也就是执行了前端定义好的回调函数，从而拿到了后台返回的结果。然后就能用这个返回结果（’abc’）做对应处理了。