JSONP工作原理

JSONP（json with padding)是一种借助script元素实现跨域的技术，它不会使用XHR对象。
script 元素有以下两个特点
1.它的src属性能够访问任何URL资源，不会受同源策略的限制。
2.如果访问的资源包含js代码，那么在下载完成后会自动执行。
JSONP就是基于这两点，再与服务器配合来实现跨域请求的
1.定义一个回调函数
2.用DOM方法动态创建一个script元素。
3.指定要请求的URL，并且将回调函数的名称作为一个参数传递过去。
4.将script元素插入到当前文档中，请求开始。
5.服务器接收传递过来的参数，然后将回调函数和数据以调用的形式输出。
6.当script元素接收到响应中的脚本代码后，就会自动执行它们。
前四步

function handle()
{
    console.log("回调函数");
}
var script = document.createElement("script");
script.src = "jsonp.php?jponp=handle"; //传递回调函数的名称
document.body.appendChild(script);

第五步

<?php
    $func = $_GET['jsonp'];
    $json = [
    'code' => '200',
    'msg'  => '操作成功',
    'data' => ['prev'=>'2016-09','next'=>'2016-11',]
            ];
    echo $func.'('.json_encode($json).')';
>

● 知道什么跨域方式吗，jsonp具体流程是什么，如何实现原生Jsonp封装，优化，对于CORS，服务器怎么判断它该不该跨域呢

常见的跨域方式大概有七种，大致可分为iframe、api跨域
1、JSONP，全称为json with padding，解决老版本浏览器跨域数据访问问题，原理是web页面调用JS文件不受浏览器同源策略限制，所以通过script标签可以进行跨域请求，流程如下：

首先前端设置好回调参数，并将其作为URL的参数

服务器端收到请求后，通过该参数获取到回调函数名，并将数据放在参数中返回

收到结果后因为是script标签，所以浏览器当做脚本运行，

2、cors，全称是跨域资源共享，允许浏览器向跨源服务器发出XMLHTTP Request请求，从而克服了ajax只能同源使用的策略，实现cors的关键是服务器，只要服务器实现了cros接口，就可以跨域通信

前端逻辑很简单，正常发起ajax请求即可，成功的关键在于服务器 Access-Control-Allow-Origin 是否包含请求页面的域名，如果不包含的话，浏览器将认为这是一次失败的异步请求，将会调用 xhr.onerror 中的函数。

Cros使用简单，支持POST方式，但是存在兼容问题

浏览器将cors请求分为两类，简单请求和非简单请求，对于简单请求，浏览器直接发出cors请求，就是在头信息之中增加一个origin字段，用于说明本次请求来自哪个协议+域名+端口，服务器根据这个值，决定是否同意本次请求，如果服务器同意本次请求，返回的响应中会多出几个头信息字段：

Access-Control-Allow-Orign：返回origin的字段或者*

Access-Control-Allow-Credentials,该字段可选，是一个bool值，表示是否允许发送cookie，

Access-Control-Expose-Headers