最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

没有使用 CORS 通配符,但出现 CORS 通配符错误

网站源码admin34浏览0评论

没有使用 CORS 通配符,但出现 CORS 通配符错误

没有使用 CORS 通配符,但出现 CORS 通配符错误

我正在使用 node、express、Vue3 开发网络应用程序

我正在尝试将表单发布到我的路由器上的端点“/match/matchpost”我已经测试了这个端点并且它在过去没有工作。我最近完成了 SSL 设置,之后我开始收到以下错误

r.js:247     GET https://localhost:5173/ net::ERR_FAILED
dispatchXhrRequest @ xhr.js:247
xhr @ xhr.js:49
dispatchRequest @ dispatchRequest.js:51
request @ Axios.js:142
httpMethod @ Axios.js:181
wrap @ bind.js:5
submitForm @ MatchForm.vue:18
(anonymous) @ MatchForm.vue:78
(anonymous) @ runtime-dom.esm-bundler.js:1483
callWithErrorHandling @ runtime-core.esm-bundler.js:173
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:182
invoker @ runtime-dom.esm-bundler.js:345
matchform:1 Access to XMLHttpRequest at 'https://localhost:5173/' (redirected from 'https://localhost:8080/match/matchpost') from origin 'https://localhost:5173' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
MatchForm.vue:35 AxiosError {message: 'Network Error', name: 'AxiosError', code: 'ERR_NETWORK', config: {…}, request: XMLHttpRequest, …}

在浏览器控制台中,它显示好像我正在尝试发出获取请求,尽管事实上我没有,正如您在此处看到的那样。

            axios.post("https://localhost:8080/match/matchpost",{
                title: this.title,
                game: this.game,
                description: this.description,
                rules: this.rules,
                participantNum: this.participantNum,
            },{
                headers:{
                    'Content-Type' : 'application/json'
                },
                withCredentials: true
            })
            .then(response => {
                console.log(response);
            })
            .catch(error => {
                console.log(error);
            });

正如您所看到的,我在发布请求中使用了整个 url,这是另一天的一个单独的小问题,但直到现在才解决。

此外,我可以在我的 VScode 控制台中看到请求显示为帖子

[Server] Received POST request at /matchpost
[Server] [2023-05-16T02:43:44.097Z] Request to Match Router: POST /match/matchpost

很明显,这些不是唯一的问题,但我怀疑它们源于 CORS 错误,该错误告诉我我不能将通配符与凭据一起使用。问题是我没有尽我所能使用通配符。

(浏览器请求头确实显示了通配符)

我已经尝试广泛搜索遇到过这个问题的人,但我没有找到遇到同样问题的人。

我尝试了各种不同的 CORS 配置,但都没有成功。

我在每个路由器的基础上配置了 CORS,并且我认为也许一个设置会干扰另一个我将我的 CORS 配置全部放入一个文件中并在需要的地方导入它。

下面是

const cors = require('cors');

const corsOptions = {
  origin: 'https://localhost:5173',  
  credentials: true,
  methods: ['GET', 'POST', 'OPTIONS', 'PUT', 'DELETE', 'HEAD'],
  allowedHeaders: ['auth-token', 'Origin', 'X-Requested-With', 'Content-Type', 'Accept'],
  preflightContinue: true,
};


const corsMiddleware = cors(corsOptions);

module.exports = corsMiddleware;

这就是我导入它的方式。

match.use(corsMiddleware);
match.options('*', corsMiddleware);

我很乐意根据要求提供更多信息。我已经尝试包含您可能需要的任何内容,但由于我不知道实际问题是什么,所以我可能会漏掉一些东西。

感谢您的帮助!

回答如下:
发布评论

评论列表(0)

  1. 暂无评论