后端设置了请求头,前端还是存在跨域问题如何解决,卡一周了,请各位帮忙看看问题纠结出在哪?

原有一个小程序,因业务需求再做一套h5的
在做h5的时候就遇到了跨域问题,我先是配置代理解决了本地跨域调试接口
但是打包部署到到线上去测试微信JSSDK的接口时被跨域拦截
之后找后端社区请求头,依然无效
图片说明
图片说明

先后查询资料说是传参问题,尝试了把参数转字符串啊,到后来直接写死参数
,但是直接就被浏览器拦截
接口的域名为https 而我打包部署的域名协议为http 域名也不一样
VUE项目,请求用的fly,

this.$http.post(api.getCollect, {
       user_id: 150,
       active_id:354
   }).then((res) => {
       console.log(res)
       if (res.data.code === 200) {
           this.$toast(res.data.msg);
           this.isCollect = 1
       } else {
           this.$toast(res.data.msg);
       }
    }).catch(err => {
        console.log(err.status, err.message)
})

参考GPT和自己的思路:

可能是由于在请求时使用的协议和域名与实际接口的协议和域名不一致导致的跨域问题。可以尝试以下解决方案:

  1. 在请求时使用与实际接口相同的协议和域名;

  2. 在后端设置响应头信息,允许接口被跨域访问:

response.setHeader("Access-Control-Allow-Origin", "*");
  1. 使用代理服务器,将前端请求转发到后端接口,从而避免跨域问题。可以参考http-proxy-middleware等框架的使用方法。

  2. 如果以上方法无法解决问题,可能还需要考虑其他因素,如安全策略、网络环境等。建议向相关技术人员或社区寻求帮助。