跨域解决方案
# 跨域解决方案
举几个解决跨域导致每次异步请求SESSIONID不一致导致++验证码或登录态无法正常效验和保持++的例子
如果不了解的建议先看以下扩展知识
1. 什么是跨域
2. SESSION基础认知
## 前端解决方案
### JQuery跨域请求案例:
```language
$.ajax({
url: this.local+'/api/apply/sendApply',
type: 'POST',
//异步请求
async:true,
//提供跨域凭据
xhrFields:{
withCredentials:true
},
//请求参数
data: {
account:account,
password:password
},
//请求成功回调事件
success: function(res){
console.log(res);
},
//请求失败回调事件
error: function(){
alert('服务器发生错误！');
}
});
```
### Vue-cli axios跨域请求案例
axios默认是发送请求的时候不会带上cookie的，需要通过设置withCredentials: true来解决
```language
axios.defaults.withCredentials = true
```
## 后端解决方案
### PHP后端允许跨域解决方案
++建议在入口文件或中间件中定义++
```language
$origin = empty($_SERVER['HTTP_ORIGIN'])?'*':$_SERVER['HTTP_ORIGIN'];
header('Access-Control-Allow-Origin: '.$origin);
header('Access-Control-Allow-Headers: token, Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-Requested-With');
header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE');
header('Access-Control-Allow-Credentials: true');
```
### Java(Springboot)后端允许跨域解决方案
++增加mvc配置类++
```language
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
System.out.println("我是MyWebConfig跨域");
//设置允许跨域的路径
registry.addMapping("/**")
//设置允许跨域请求的域名
.allowedOrigins("*")
//是否允许证书 不再默认开启
.allowCredentials(true)
//设置允许的方法
.allowedMethods("*")
//跨域允许时间
.maxAge(3600);
}
}
```
## 什么是跨域？
跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。
例如：a页面想获取b页面资源，如果a、b页面的协议、域名、端口、子域名不同，所进行的访问行动都是跨域的，而浏览器为了安全问题一般都限制了跨域访问，也就是不允许跨域请求资源。注意：跨域限制访问，其实是浏览器的限制。理解这一点很重要！！！
同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域；
### 跨域访问示例
假设有两个网站，A网站部署在：http://localhost:81 即本地ip端口81上；B网站部署在：http://localhost:82 即本地ip端口82上。现在A网站的页面想去访问B网站的信息，A网站页面的代码如下（这里使用jquery的异步请求）
```language
$(function (){
$.get("http://localhost:82/api/values", {},function (result) {
$("#show").html(result);
})})；
```
从错误信息可以看出以上出现了跨域问题！
## SESSION基础认知
### 什么是session
session用来追踪每个用户的会话。使用服务器生成的session_id进行标识，用来区别用户。
### session存放在哪里
session存放在服务器的内存中，session_id存放在服务器内存以及客户机中的cookie中
### sessionid与session有什么用
当用户发送请求的时候，服务器将用户cookie里面记录的session_id和服务器内存中存放的session_id进行比对，从而找到用户相对应的session进行操作。
所以，如果客户端禁止了cookie的话，那么session也就没有办法使用。
### session的创建
session是在服务器端程序运行的过程中创建的，不同的语言实现的应用程序创建session的方法不同，比如在Java中我们是通过调用HttpServletRequest的getSession方法（使用true作为参数）创建的。
在创建session的时候，服务器也会为该session创建唯一的session_id，而这个session_id在随后的请求中可以用来重新获取已经创建了的session。
在session创建完成之后，就可以调用session相关的方法往session中增加内容了。但是这些内容只会保存在服务器内存中，只有session_id被发送到了客户端。
### session的删除
session会在以下的情况中被删除
1. 超时
2. 程序中调用HttpSession.invalidate()
3. 程序关闭
### 程序的session会因为浏览器的关闭而删除么？
不会