jsonp是怎么通过script标签进行跨域的

发布网友发布时间：2022-04-18 19:44

共1个回答

热心网友时间：2022-04-18 21:14

script标签的还在是可以跨域的，jsonp 就是利用这一点来跨域。

在 GET 请求中，我们都是为了获取远程的一些数据，所以要实现的目的就是服务器端代码要通过某种方式让 JavaScript 能够拿到数据。所以，jsonp 的实现大概有以下几个步骤：

创建一个全局的临时函数，并在函数内调用响应回调

// jsonp1 是生成的一个临时函数名，可以通过简单的计数来生成，如jsonp2, jsonp3

// 生成不同的函数的目的是为了防止多个 jsonp 同时请求，回调的函数被覆盖

window.jsonp1 = function( data ) {

    // 调用在成功之后的回调方法

    onsuccess( data );

    // 删除临时函数，释放内存

    window.jsonp1 = null;

};

2. 通过 document.createElement( 'script' ) 创建 script 标签，src 属性设置成远程的 api 的 url。其实就是让浏览器加载一段 JS，这段 JS 就是服务器返回的内容。

3. 服务器端对返回的数据进行包装，生成一段 JS，这段 JS 里面调用了 jsonp1 这个方法，并且把数据作为参数传进去。

4. script 标签加载完成之后，jsonp1 被执行，通过 onsuccess 将 data 传递给回调方法，jsonp1 方法被销毁，释放内存。