Javascript 使用Cypress进行Auth0身份验证

我正在尝试为Cypress创建一个登录命令，并注意到他们关于如何做到这一点的博客与。他们似乎使用了一个定制的express应用程序来处理登录，而不是使用SDK来处理登录（根据）

Cypress生成一个本地存储键值对，如下所示

const项={
正文：{
decodedToken：{
声称，
用户：{…}，
观众
客户id，
},
},
到期日期：exp，
}
window.localStorage.setItem（'auth0Cypress'，JSON.stringify（item））

但是，由Auth0 React SDK创建的SDK会产生类似的结果：

const项={
正文：{
访问令牌，
观众
客户id，
decodedToken：{
声称，
用户：{…}，
编码的，
标题
},
在,，
身份证，
范围
令牌类型
},
到期日期：exp
}
window.localStorage.setItem（`@@auth0spajs@@:${client\u id}:$:${viewer}:${scope}`，JSON.stringify（项））

我能够让

https://${auth）\u domain}/oauth/token

请求正常工作，但是我无法确定如何从响应中获取数据，以使其符合Auth0 react SDK想要的数据结构

有人在这方面取得过成功吗

---

在进行一些探索之后，我从

/oauth/token

返回的响应似乎不包含Auth0 React SDK登录时输出的值的所有字段

我还注意到，关于如何与Cypress集成，它没有使用此SDK，而是使用SPA SDK。该指南还使用了一个自定义登录表单，我使用的是LockUI

---

需要注意的一点是，我没有使用后端进行身份验证（就像大多数示例中那样）。我使用

loginWithRedirect

按照官方建议登录。

经过Auth0团队的调查和帮助，我成功地完成了这项工作

以下是我使用的代码：

Cypress.Commands.add（“登录”，（）=>{
cy.clearLocalStorage（）；
const email=“”；
const password=“”；
const client_id=“”；
const client_secret=“”；
const观众=”；
const scope=“”；
赛义德请求({
方法：“张贴”，
url:“”，
正文：{
授权类型：“密码”，
用户名：email，
密码，
观众
范围
客户id，
客户的秘密，
},
})。然后（{body:{access\u token，expires\u in，id\u token，token\u type}）=>{
cy.window（）。然后（（win）=>{
win.localStorage.setItem(
`@@auth0spajs@@:${client_id}:${acquisition}:${scope}`，
JSON.stringify({
正文：{
客户id，
访问令牌，
身份证，
范围
在,，
令牌类型，
decodedToken：{
用户：JSON.parse(
Buffer.from（id_token.split（“.”[1]”，“base64”）.toString（“ascii”）
),
},
观众
},
expiresAt:Math.floor（Date.now（）/1000）+expires\u in，
})
);
cy.reload（）；
});
});
});

必须确保传入的配置与Auth0提供程序中使用的配置完全相同

有一件事让我大吃一惊，那就是我也在使用刷新令牌。如果是这种情况，请确保将

脱机访问添加到您的范围中

我有一个公共回购来下载一个有效的解决方案-。
中有一个例子，一个支付应用程序来演示Cypress测试方法、模式的实际使用，和工作流，以及详细说明Auth0应用程序和中的更改的工作流。
检查本文本指南中使用的SKD与推荐的React SDK不同。它使用了官方React SDK中未公开的API，如
checkSession（）
。不要担心checkSession。您不必明确地调用它。Auth0 React SDK只是atuh0 spa SDK的包装器，因此它始终隐式调用checkSession（例如，在创建客户端时）。当您使用令牌重定向到回调时，如果您在Auth0 React SDK中正确设置了所有内容，SDK将设置所有必需的Cookie和存储属性。您还可以使用lockUI查看此处的示例，了解整个锁定工作流