參考:https://cloud.tencent.com/developer/article/1668879
課件代碼:https://gitee.com/flymini/codes02/tree/master/cors_/com-learn-cors01
****
從后端解決跨域訪問,總結如下幾種解決方案,采用其中任意一種即可。
<br/>
**1. 在 controller 層采用注解`@CrossOrigin`**
```java
@RestController
@CrossOrigin //將注解用在類上或方法上
public class VideoController {
@PostMapping(value = "/demo")
public Json demo(HttpServletRequest request, HttpServletResponse response) {
System.out.println("...demo...");
}
}
```
<br/>
**2. 實現方法`addCorsMappings`**
```java
@Configuration
public class DemoConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**") //允許訪問 /**
.allowedOrigins("*") //允許跨域訪問
.allowedMethods("GET", "POST") //允許以GET、POST方法訪問
.allowedHeaders("*") //允許任意請求頭訪問
.allowCredentials(true);
}
}
```
<br/>
**3. 在過濾器中配置允許跨域訪問**
```java
@Component
@WebFilter
public class CorsFilter implements Filter {
@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "*");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "*");
response.setHeader("Access-Control-Allow-Credentials", "true");
chain.doFilter(req, res);
}
}
```
<br/>
**4. 在攔截器中配置允許跨域訪問**
(1)實現攔截器接口。
```java
@Component
public class CustomHandlerInterceptorAdapter extends HandlerInterceptorAdapter {
@Override
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "*");
response.setHeader("Access-Control-Allow-Credentials", "true");
return true;
}
}
```
(2)注冊攔截器到環境中。
```java
@Configuration
public class CustomWebMvcConfigurer implements WebMvcConfigurer {
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(new CustomHandlerInterceptorAdapter());
}
}
```
<br/>
**5. 通過網關訪問**
允許跨域訪問網關,然后由網關去訪問想要的服務。
```yml
spring:
cloud:
gateway:
globalcors:
cors-configurations:
'[/**]':
allow-credentials: true
#允許跨域的源(網站域名/ip),設置*為全部
allowed-origins:
- "http://xb.abc.com"
- "http://sf.xx.com"
allowed-headers: "*"
#允許跨域的method,默認為GET和OPTIONS,設置*為全部
allowed-methods:
- OPTIONS
- GET
- POST
- DELETE
- PUT
- PATCH
max-age: 3600
```
>[warning]注意: 通過 gateway 轉發的其他項目,不要再進行跨域配置。
- 跨域問題
- 跨域是什么
- 跨域解決方案
- 從后端解決
- nginx反向代理
- WebSocket
- websocket是什么
- websocket協議
- 使用場景
- 實現方式
- 注解與html5原生方式
- websocketAPI
- 實現步驟
- 文件上傳
- 文件下載
- 廣播通信
- 定時推送
- 編程與socketjs方式
- socketjs與stompjs框架
- 實現步驟
- 重載目的地
- SimpMessagingTemplate
- 定時向前端推送數據
- 5種監聽事件
- 點對點通信
- 攔截器
- HandshakeInterceptor
- ChannelInterceptor
- poi之excel表格
- 表格版本
- POI常用類
- POI依賴
- 寫表格
- 編寫表格過程
- 單元格邊框樣式
- 單元格背景色
- 凍結行或列
- 單元格合并
- 單元格內換行
- 文檔內跳轉
- 讀表格
- Web中的Excel操作
- 導出表格
- 讀取表格
- poi之word文檔
- word版本
- 寫word
- 基本使用
- 標題樣式
- 添加圖片
- EasyExcel表格
- EasyExcel是什么
- 與其他Excel工具對比
- EasyExcel依賴
- 讀Excel
- 簡單讀取
- 指定列位置
- 讀取多個sheet
- 格式轉換
- 多行表頭
- 同步讀
- 寫Excel
- 簡單寫入
- 單元格樣式
- 攔截器
- 列寬
- 凍結行或列
- 合并單元格
- 填充Excel
- SpringSecurity
- SpringSecurity是什么
- 同類型產品對比
- 環境搭建
- 相關概念
- 密碼加密
- Web權限控制
- UserDetailsService接口
- 登錄認證
- 自定義登錄頁
- 未授權跳轉登錄頁
- 權限控制
- 自定義403頁面
- 權限注解
- 記住我功能
- 注銷功能
- CSRF
- CSRF是什么
- CSRF保護演示
- 前后端分離權限控制
- 環境搭建
- 認證實現
- 會話管理
- 動態權限管理
- 微服務權限控制
- 權限控制方案
- SpringBoot整合RabbitMQ
- 整合步驟
- Fanout交換機演示
- Direct交換機演示
- Topic交換機演示
- @RabbitListener方法
- JWT認證與授權
- 環境搭建
- 密碼加密
- 認證與授權