前段解决跨域 proxy 实现

在前端开发中，可以通过配置代理服务器来实现跨域请求。代理服务器充当前端和目标服务器之间的中间人，接收前端的请求并将其转发到目标服务器，然后将目标服务器的响应返回给前端。这样前端就可以绕过浏览器的同源策略，实现跨域请求。

在常见的前端开发框架中，如 Vue、React 或 Angular，都提供了配置代理服务器的选项。下面以 Vue CLI 为例，介绍如何通过配置代理实现跨域请求：

在 Vue 项目的根目录下，找到 vue.config.js 文件（如果不存在，则需要手动创建）。

在 vue.config.js 文件中，添加以下配置代码：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://api.example.com', // 目标服务器的地址
        changeOrigin: true,
        pathRewrite: {
          '^/api': '' // 可选的路径重写规则
        }
      }
    }
  }
};

在上述配置中，'/api' 是前端发送请求时的路径前缀，'http://api.example.com' 是目标服务器的地址。你可以根据实际情况进行修改。

如果目标服务器返回的响应中包含跨域的 Cookies，你还需要将 changeOrigin 设置为 true，以确保跨域请求中携带 Cookies。

如果需要对请求路径进行重写，可以使用 pathRewrite 配置项。上述示例中，请求路径中的 '/api' 会被替换为空字符串。

保存配置文件，重启开发服务器。现在，前端在请求 '/api/some-endpoint' 时，将会被代理服务器转发到目标服务器 http://api.example.com/some-endpoint。

通过配置代理服务器，前端可以在开发环境中轻松地实现跨域请求，而无需在实际部署时处理跨域问题。不同的前端框架和开发环境可能有不同的配置方式，请参考相关文档进行具体配置。