💐💐重温经典之被阻止的跨域请求能做什么?

740 阅读4分钟

这是我参与11月更文挑战的第6天,活动详情查看:2021最后一次更文挑战


大佬们好,我是江湖不渡i,前端菜鸡,react初学者。

🌲🌲 文章开头先问大佬们两个问题:
    1.当我们请求跨域之后,浏览器在哪个阶段阻止了这次请求?
    2.为什么我们接口要加token等验证身份的字段?除了业务场景还有没有别的原因?

大佬们先思考着,我们说点前置的知识:
    跨域的产生原因是因为浏览器的同源策略,也就是协议+域名+端口至少有一个不同。当然浏览器也支持我们通过合法的手段进行跨域请求,常用的方法有图片探测、JSONP、CORS、Nginx、中间件等等。(其实我本来是想写图片探测和JSOPN跨域的原理还有一些注意事项类,写着写着意识到一个问题,然后就跑偏了💦)这些跨域的原理还有注意事项我们下次再说。😄

废话说完了,我们来看一下上面的两个问题:
🍬🍬🍬🍬🍬🍬🍬🍬
     当我们请求跨域之后,浏览器在哪个阶段阻止了这次请求?
    我相信各位大佬也都知道第一个问题的答案,就是我们的请求就算是跨域了,请求也是能够到达服务端的,服务端也是能够正常响应的,但是在响应到达客户端之前被浏览器拦截掉了。下面稍微验证一下:

    服务端使用egg启动了一个服务,地址是http: //127.0.0.1: 7001 截屏2021-11-25 下午7.25.27.png

截屏2021-11-25 下午7.26.17.png

    客户端就使用fetch发送请求:

截屏2021-11-25 下午7.28.07.png

    请求结果控制台输出:显示跨域了 截屏2021-11-25 下午7.28.40.png

     这会我们来看服务端输出:

截屏2021-11-25 下午7.30.01.png      可以看到,虽然请求跨域了,但是服务端依然接受到了我们的请求,而且给予了响应。
     所以这样也验证了我们的说法:我们的请求就算是跨域了,请求也是能够到达服务端的,服务端也是能够正常响应的,但是在响应到达客户端之前被浏览器拦截掉了。

我们接下来看第二个问题:
🍬🍬🍬🍬🍬🍬🍬🍬
     为什么我们接口要加token等验证身份的字段?除了业务场景还有没有别的原因?
     不知道看了第一个问题的大佬,看到这个问题有什么思考?尤其是看到我们发送的跨域请求服务端能接受到,而且能做出响应的时候?举个例子:假如我们提交的跨域请求是修改数据库的,那么数据库是不是被修改了? (为什么会有这样的想法,因为现在很多中小型公司后端为了方便,设置的都是允许所有的请求来源。)
    所以就可以得出来一个结论,我们接口要加token等验证身份的字段一部分原因是因为业务需要,记录用户信息等,还有一部分原因就是为了防止后端设置了统配,出现在别的地方可以修改数据库的情况。(特殊情况,哈哈)

    最后回到我们的题目上:被阻止的跨域请求能做什么?
    两个问题了解下来,就算请求跨域被阻止了除了获取数据库的东西之外,依旧能做到很多东西,修改数据库内容比如给你的假期余额调整成无限天,哈哈😄

    文章到这里就结束了,感谢各位大佬观看,写本文的缘由是因为本来在想跨域什么时候被阻止的时候,突然想既然请求能到服务端,那服务端岂不是可以做我想要的操作,一点点胡思乱想,哈哈,见笑了。

最后祝各位大佬学习进步,事业有成!🎆🎆🎆