前言
浏览器跨域问题在前端已经是一个老生常谈的话题了，根本原因是浏览器的同源策略，只有在协议,域名,端口是一样的情况下，彼此之间才能互相的请求资源，否则就会出现跨域问题
疑惑
但是你有遇到或看到过这样的场景吗？
后端小哥写了一个接口(get请求)，丢给了前端，任务很简单（半天搞定），在前端页面中请求接口把数据按照ui效果图展示出来即可
前端小哥收到接口后，复制链接到浏览器地址栏回车，刷刷的json数据出来了，然后回复后端：收到，接口可用 🍕
前端小哥心想：接口没问题，一小时写界面，半个小时接口联调和测试绰绰有余，于是计算好时间，继续手中的其他工作
2个小时后，开始写界面，调整页面细节搞定~，然后调用接口，咦...不行，浏览器报错，一看原来是跨域问题, 就跟后端说接口跨域了，于是中间又经历了各种互怼和调试..赶在时间点之前终于把问题解决了..
🙋♂️ 所以为什么会出现地址栏访问接口地址可以，而网页中请求就不行呢？
解惑
其实这个问题早期的时候也困惑过我，究其原因还是对浏览器相关的知识了解的不够细致
XMLHttpRequest接口请求
目前前端开发中所有的请求都是基于浏览器XMLHttpRequest对象实现的，而浏览器的同源策略中提到了XMLHttpRequest是严格遵守同源策略，非同源不可请求，所以在代码中通过ajax请求的时候不同源浏览器会报错
浏览器地址栏请求
对于浏览器最常用的地址栏功能，请求url地址的时候是通过http协议中的location对象来发送同步请求的，不是走的XMLHttpRequest请求，所以不受同源策略限制
