Web开发学习之 跨域问题

写在前面

        web开发过程中，总是绕不开跨域问题，大家在网上可以搜到很多文章或者视频，个人最近遇到以上问题，由于基础薄弱，在阅读了几篇篇概念堆砌的文章之后，仍然有所疑惑，自己琢磨明白之后。想尝试下用自己认为更加直白的方式来的解释一遍。有任何考虑不周或者事实逻辑错误，还请指出。

何为跨域

        先对上图做个简单解释，假设我们访问了网址为http://yourdomain.com/search.html,在这个页面中有个输入框，供用户输入一个WebApi 的url。输入框右侧的按钮点击之后，会调该接口。如上图，假设我们输入框输入目标接口url：http://xxx.com/data/get。此时由于页面域为http://yourdonmain.com， 按钮点击要访问另一个域：http://xxx.com。页面的要某个资源，该资源的域与页面域不一致，此为跨域。

         补充说明：有些人可能会把跨域曲解成： 浏览器和服务器不在同一个主机上，然后浏览器去访问服务。这个不是跨域，切记！！！

浏览器同源策略

        页面域为A的页面（以下我们称其为页面A），页面A存在调用服务器B接口的行为，浏览器认为这种情况对服务器B来说是一种不安全的行为。浏览器检测上述跨域行为之后会先发一个预检请求问一下服务器B是否接受这个不安全行为，服务器B响应允许，浏览器才会把真正的请求发出，否则浏览器向用户发出不允许跨域的提醒。

何为跨域问题

        跨域访问行为中，浏览器发送的预检请求没有得到服务器的响应，或者得到服务器的拒绝响应，真正的请求不会发出，从而导致页面用户无法访问目标资源的问题，称为跨域问题。 遵守浏览器同源策略的情况下，跨域问题解决的根本是服务器要对预检请求进行响应。

解决方式

CORS中间件

        每种语言以及其web应用框架都会有应对跨域访问问题的措施，最常见的做法通过中间件的方式。大家可自行AI的具体做法，比如你找文心一言提出一下问题：如何在asp.net core web api应用程序中设置允许跨域访问。

JsonP（不推荐做法，简单了解即可）

略（可能后续补充...）

补充 

        以下视频，我个人觉得讲解清晰明了，推荐大家观看。

【掌握CORS跨域请求，看这个视频就够了【渡一教育】-哔哩哔哩】