在springboot項(xiàng)目中淋纲，前端html頁面和后端api接口是分離的匈挖，實(shí)際項(xiàng)目部署的時候也是分開部署的稠氮。這樣由于IP不同或者端口不同兄猩，就存在跨域問題茉盏，導(dǎo)致html無法調(diào)用api鉴未。
為解決此問題，實(shí)際項(xiàng)目部署的時候一般有三種解決方案：
（1）使用Nginx反向代理
使用Nginx反向代理鸠姨，根據(jù)訪問路徑進(jìn)行攔截铜秆，如果是html則指向靜態(tài)頁，如果是api讶迁，則把請求跳轉(zhuǎn)到api的訪問地址连茧。一般這是大部分項(xiàng)目推薦使用的部署方式。
具體Nginx配置如下：

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;

    #前端頁面服務(wù)器
    server {
        #監(jiān)聽端口和域名
        listen       8080; 
        server_name  localhost;

        #添加頭部信息
        proxy_set_header Cookie $http_cookie;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        
        #攔截api接口訪問
        location /api/ {              
               proxy_pass http://localhost:8080/;  #注意：使用代理地址時末尾記得加上斜杠"/"添瓷。      
        }
        
        #攔截靜態(tài)頁html
        location / {
               root   html/www;  #注意：使用"/"攔截全路徑的時候記得放在最后梅屉。
               index  index.html index.htm;  #index表示首頁 
        }           
        
    }
}

（2）將api和html部署在同一個tomcat
由于跨域是IP和端口不同導(dǎo)致的，那么將html和api部署在同一個tomcat中鳞贷，就不存在跨域問題坯汤。只需將springboot項(xiàng)目打成war包和html部署在一就行，簡單方便搀愧。這種方式只適合小型項(xiàng)目惰聂，一般不推薦。

（3）在springboot代碼層面允許跨域
在springboot項(xiàng)目代碼層面加入支持跨域配置咱筛，也可實(shí)現(xiàn)跨域訪問搓幌。這種方式適合開發(fā)調(diào)試階段使用。一般都要求邊開發(fā)邊調(diào)試迅箩，我就是與前端人員進(jìn)行同步開發(fā)調(diào)試溉愁，在代碼層面開啟跨域訪問，開發(fā)調(diào)試起來非常方便饲趋。
springboot開啟跨域支持非常簡單拐揭，只需要在啟動類中配置WebMvcConfigurer，并重寫addCorsMappings方法即可奕塑。

@Configuration
public class MyMvcConfig {

    @Bean
    public WebMvcConfigurer  webMvcConfigurer(){
        return new WebMvcConfigurer() {

            //配置跨域
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")     //允許的路徑
                        .allowedMethods("*")     //允許的方法
                        .allowedOrigins("*")       //允許的網(wǎng)站
                        .allowedHeaders("*")     //允許的請求頭
                        .allowCredentials(true)
                        .maxAge(3600);
            }
}

以上三種方式均可解決跨域問題：方法1是推薦的部署方式堂污；方法2是適合小項(xiàng)目；方法3是推薦開發(fā)調(diào)試階段使用龄砰。