非常离谱的uniapp跨域问题

Question

遇到一个非常非常奇怪的问题
uniapp的跨域问题。没想到21世纪了居然有这么离谱的东西存在。
前端uniapp端口用本地的8080
后端端口用本地的8088
下面的代码在我vue项目里都是没有问题的，反而在uniapp里出了笑话，有人跟我说是这两个页面的代码冲突了
baseURL设为“”就行，很可惜不行。
好了话不多说直接上代码：跨域设置

"h5" : {
        "devServer" : { 
            "port" : 8080,
            "disableHostCheck": true,
            "https" : false,
            "proxy" : {
                "/api" : {
                    "target" : "http://192.168.18.43:8088",
                    "changeOrigin" : true,
                    "secure" : false,
                    "pathRewrite" : {
                        "^/api" : ""
                    }
                }
            }
           
        },
        "title" : "抽奖信息采集",
        "router" : {
            "mode" : "hash"
        }
    }

还有就是我的axios设置https.js

import axios from "axios";

// 创建自定义接口服务实例
const http = axios.create({
    baseURL: 'http://192.168.18.43:8088',//根据个人后端情况，修改此处baseURL
    timeout: 6000, // 不可超过 manifest.json 中配置 networkTimeout的超时时间
    withCredentials: true,
    headers: {
        'Content-Type': 'application/json',
        //'X-Requested-With': 'XMLHttpRequest',
    },
})

// 拦截器 在请求之前拦截   添加token
http.interceptors.request.use(config => {
    //请求前有关处理逻辑
    return config
})
// 响应后的拦截
http.interceptors.response.use(response => {
    //响应拦截处理逻辑
    return response;
}, error => {
    
    return Promise.reject(error.message)
})

export default http

Answer 1

源于chatGPT仅供参考

跨域问题在前端开发中是一个常见的挑战，而uni-app作为一种跨平台的开发框架，也需要处理跨域请求。下面是一些建议来解决uni-app中的跨域问题：

1. 在`manifest.json`文件中配置`h5`字段下的`devServer`属性，用于配置开发环境下的跨域请求。

```json
"h5": {
  "devServer": {
    "disableHostCheck": true,
    "proxy": {
      "/api": {
        "target": "http://192.168.18.43:8088",
        "changeOrigin": true,
        "secure": false,
        "pathRewrite": {
          "^/api": ""
        }
      }
    }
  }
}

请确保配置中的target值与后端服务器的地址和端口相匹配。这样，当你在uni-app中发起以/api开头的请求时，就会被代理到目标服务器。

1. 在axios的请求示例中，可以直接使用基础URL进行请求，而不需要在每个请求中都写上完整的URL。

import axios from "axios";

const http = axios.create({
  baseURL: '/api', // 使用"/api"作为基础URL
  timeout: 6000,
  withCredentials: true,
  headers: {
    'Content-Type': 'application/json',
  },
});

// 省略拦截器代码

export default http;

通过设置基础URL为/api，请求将会被代理到后端服务器。

请确保在uni-app中使用axios发送请求时，使用相对路径而不是绝对路径来发起请求。

如果以上方法仍然无法解决跨域问题，请提供更多的详细信息，以便我们能够更好地帮助您。

```