出现问题：

localhost/:1 Access to XMLHttpRequest at 'https://spark-api-open.xf-yun.com/v1/chat/completions' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. ChatComponent.vue:61 Error request: XMLHttpRequest sendMessage @ ChatComponent.vue:61 spark-api-open.xf-yun.com/v1/chat/completions:1 Failed to load resource: net::ERR_FAILED

原因：

        由于CORS（跨域资源共享）问题引起的。浏览器安全策略不允许从一个域（ http://localhost:8080）访问另一个域（ https://spark-api-open.xf-yun.com）的资源，除非目标域明确允许这种访问。

后解决办法有：

• 使用代理服务器：在本地开发服务器上设置一个代理，将请求转发到目标服务器。
• 后端中转：在服务器端代码中设置一个中转路由，将请求从前端转发到目标服务器。
• 在API服务器上设置CORS：在服务器上允许你的域名进行访问。（不太可行）

配置Vue CLI代理

在Vue项目根目录下找到或创建 vue.config.js 文件，并添加以下内容：

module.exports = {
    devServer: {
        proxy: {
            '/api': {
                target: 'https://spark-api-open.xf-yun.com',
                changeOrigin: true,
                pathRewrite: { '^/api': '' },
                secure: false
            }
        }
    }
};

后在vue组件中，将请求的URL修改为相对路径：

const response = await axios.post('/api/v1/chat/completions'.........查看开发文档)

另外QPS（Query Per Second）是指每秒处理请求数。这是用来衡量服务性能的指标，描述每秒数万次的高并发场景。