這裡說的域名就是ip+埠繫結的；可以這樣理解一個解析後的域名 等同於 Ip+埠

例如：
解析後的域名：www.baidu.com/api = localhost:80/api =190.168.1.1:80/api 

通常情況下，後端在配置請求的時候，如果沒有設定允許所有域名訪問，那麼我們本地瀏覽器開啟的 localhost:80通過axios發起的請求就會被瀏覽器的同源策略攔截；本質原因就是 域名不一致，前端請求的域名是：localhost:80/api，後端介面的域名是：www.****.com/api ;被瀏覽器識別成不同的域名了；

我這裡貼一個java裡面處理跨域的方法，測試環境能改後端是最簡單的了，*代表允許所有的域名訪問（localhost:80/api被包含了）

    @Override
    public void addCorsMappings(CorsRegistry registry) {
      // 設定允許跨域的路徑
        registry.addMapping("/**")
                // 設定允許跨域請求的域名
                .allowedOriginPatterns("*")
                // 是否允許cookie
                .allowCredentials(true)
                // 設定允許的請求方式
                .allowedMethods("GET", "POST", "DELETE", "PUT")
                // 設定允許的header屬性
                .allowedHeaders("*")
                // 跨域允許時間
                .maxAge(3600);
    }
 

進入正題：前端本地的解決方式

在使用webpack或者vite構建工具時候，配置反向代理，把本地所有的axios請求的地址請求地址（域名：埠）改成：/api/,

  baseURL: "/api/",

我使用vite打包，在vite.config.js中進行配置代理；使用正則表示式，本地發起請求的地址 /api/ 都會被自動替換成實際後端請求地址；這樣就實現了當前請求的地址就會被後端接收識別為和都一樣的域名；保證了前後端域名一直，解決了跨域；

    server: {
        host:"0.0.0.0",
        open: true,//啟動專案自動彈出瀏覽器
        port: 3000,//啟動埠
        proxy: {
            "/api": {
                target: 'http://121.****.93.45:19002',	//實際後端請求地址
                changeOrigin: true,
                rewrite: (path) => path.replace(/^\/api/, '')

            },
        }
    }
 

加個備註

如果實際專案部署，nginx裡面也可以使用同樣的方式，通過反向搭理轉發，來解決跨域問題

    location /api {
        proxy_set_header  X-Real-IP   $remote_addr;
        # api_server是自己定義的upstream
        proxy_pass http://111.****.91.20:8081;
    }