vue3文件上传跨域问题

在 Vue3 中进行文件上传时可能会遇到跨域问题。解决这个问题有两种常见的方法：

1. 在服务器端设置允许跨域访问。可以在服务器端设置响应头信息，允许指定的域名访问。例如在 PHP 中可以使用以下代码：

header('Access-Control-Allow-Origin: *');

2. 使用代理。可以在 Vue3 项目中配置代理，将请求先发送到本地服务器，再由本地服务器代理发送到目标服务器，这样就能绕过跨域限制。在 Vue3 的配置文件 vue.config.js 中进行如下配置：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://example.com',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

上面的代码将所有以 /api 开头的请求代理到 http://example.com 上，并将 /api 前缀去掉。这样在发送请求时可以使用如下代码：

axios.post('/api/upload', formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  }
})

这样就能够成功上传文件了。