静默认证对Auth0 CORS错误

Question

对于特定需求，我需要从前端对auth0执行静默身份验证(prompt=none)，并将响应重定向到后台。之后，我的后台将交换访问令牌的授权码并将其检索到前台(此过程不常见，但我的问题集中在第一个请求上)。

为了实现这一点，我使用了"fetch"如下:

const silentLoginUrl: string = 'https://xxx.us.auth0.com/authorize?response_type=code&client_id='+client_id+'&redirect_uri=http://localhost:3000/callback&scope=openid&state='+state+'&code_challenge='+code_challenge+'&code_challenge_method=S256&prompt=none';
fetch(silentLoginUrl, {
method: 'GET',
credentials: 'include',
redirect: 'follow',
headers: {
'Content-Type': 'text/html; charset=utf-8'
},
})

我还在允许的Web起源和允许的起源(CORS)中配置auth0与http://localhost:8080, http://localhost:8080/, http://localhost:3000/callback(8080是我的单页应用程序)。

但是当我测试时，我仍然在飞行前(选项)请求上得到CORS错误:404:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource(Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

确实没有标题"Access-Control-Allow-Origin"在响应中，尽管有auth0配置

如果我直接在浏览器中执行伪造的url，一切都可以正常工作。

您遇到过这种类型的错误吗?是否有可能通过GET取回进行此调用?

Answer 1

现在我有完全相同的情况。虽然这不是最好的解决方案，但我发现使用"no-cors"模式是有效的。

有了这个，可能你会有请求返回给你一个302，但可能你会开始面对我的实际问题，实际重定向到在URL中有access_token。fetch API似乎无法重定向url中的交互。

问候，请让我知道，如果你找到另一种方式，我们需要在我们的应用程序中做一个沉默验证相同的用例。