面试官因为我的JSONP讲解成了粉丝，这次面试真值！

那是在一个草长莺飞的下午，我没有带纸质简历，只身前往了面试地点，看着外面的知了如此生动的叫喊着，仿佛他们就在说：面试必过，面试必过。

经过一番等待，终于见到了面试官，他是一个戴着眼镜，穿着格子衬衫，头发不多，留着络腮胡的人，手里抱着一台看不清什么品牌的电脑。然后跟我说，坐吧，我说好的。

然后他说，你的简历写的不错啊，我们HR一眼就看准了，说一定要面一面这个人。我说，嘿嘿，我也时常帮人优化简历，熟练了。然后他说：我们开始面试吧。我说，好的。

前面的题目还算很基础，我一边回答着，面试官一边在他那台电脑上敲打着什么。

🚎重点来了。

他问我：请你说一下JSONP的跨域原理。我说好的。

然后我飞速的运转着我的FPU，我心理已经想好了，我应该这么说来着：

因为浏览器的同源策略呢，不同域之间请求会出现跨域异常，但有件事情很特别，那就是我们的HTML页面可以引入其他域的Javascript文件，这就为JSONP跨域制造了条件。

前端项目中呢，我们可以动态生成一个 script 标签，并将其插入到DOM中。这个 script 标签的 src 属性会指向一个包含跨域数据的URL。前端在构建请求URL时，会将一个回调函数的名字作为参数传递给服务器。例如，假设回调函数名为 callbackFunction 。服务器接收到请求后，会生成JSON数据，并将其包裹在回调函数的调用中。

他的优点呢就是不需要复杂的服务器端配置，可以在不支持CORS的情况下实现跨域请求，支持老旧浏览器。缺点呢就是JSONP只能发送GET请求，不能用于POST、PUT、DELETE等其他HTTP动词请求。

🤦‍♀️但我转念一想，这么回答不行

这样回答太生硬了，不能充分让面试官理解JSONP如何工作啊。但是我怎么给面试官演示一下呢？就在这个时候，我看到了面试官手中的那台电脑。

我问：你这台电脑里有前端项目吗？
他说：有。
我说：都有什么技术栈的？
他说：Vue的，Vue3的，React的都有，怎么了？
我说：我给你当场演示一下吧。
他说：不用了
我说：来吧
他说：真不用了
我说：真的来吧
他说：好吧🙄

开始我的操作

我先让他打开了一个Vue项目，他说，然后呢？我说，你再打开一个node服务端的项目，写一个接口，他说怎么写？我说你启动一个 koa 的项目，随便写个jaonp跨域的接口。

他说然后呢？我说，然后你打开你的Vue项目，首先安装一个神奇的前端JS库，叫 js-tool-big-box。他说这是干啥的？我说：这是一个前端JS库，前端项目开发里面的大多数公共方法，这里面都有，而且高效、便捷、好用、全面、简单易上手。他鼓了鼓掌说：好的，太棒了，我就需要这样的JS库呢。

然后在Vue项目中写下这样的代码：

import { ajaxBox } from 'js-tool-big-box';

ajaxBox.sendJSONP('http://127.0.0.1:3000/users/bar', 'callback', function(data){
  console.log('获取到的JSONP请求数据', data);
});

他说，然后呢？我说，你打开浏览器看一下效果，你的node端也没有做CORS跨域设置，但是这个接口通了，这就是JSONP。然后，我看到他用那台电脑，打开了浏览器：

就这样，他送我出了门，临走前，他又问我：你那个前端JS库，能够帮助大家写公共方法，少install第三方库的名字叫啥来着，我说叫：js-tool-big-box。他说：你什么时候最快入职？我说：明天吧。他说：那我明天早点来，给你买份早餐。我说：好的。

我走出去一公里了，他又追上我问：你简历写的不错，教教我呗，我说好的，你关注我，我跟你说，这是内功。他开心的走了。领走的时候，给我手里塞了一杯蜜雪冰城甜蜜蜜。