如何解决使用 AWS 放大联合反应 SSR 始终返回未通过身份验证
我正在使用 Razzle
SSR 库构建 React 应用程序,并且我正在尝试使用 amplify 库实现 AWS Cognito 联合身份验证。
登录链接成功后再次重定向到应用程序,但即使登录成功,也始终显示未验证错误。
到目前为止我的代码:
clinet.js
import React from "react";
import { hydrate } from "react-dom";
import App from "./App";
import { browserRouter } from "react-router-dom";
import createStore from "./server/ssr-store";
import { Provider as ReduxProvider } from "react-redux";
import Amplify from "aws-amplify";
import amplifyConfig from "./config/amplifyConfig";
const storeBase64ToString = Buffer.from(window.Redux_DATA,"base64").toString();
const storeData = JSON.parse(storeBase64ToString);
const store = createStore(storeData);
Amplify.configure(amplifyConfig);
hydrate(
<ReduxProvider store={store}>
<browserRouter>
<App />
</browserRouter>
</ReduxProvider>,document.getElementById("root")
);
if (module.hot) {
module.hot.accept();
}
App.js
const getUserInfo = () => {};
//////////////////////////
const checkAuth = async () => {
console.log("checkAuth");
let user = null;
Hub.listen("auth",async ({ payload: { event,data } }) => {
switch (event) {
case "cognitoHostedUI":
user = await getUser();
setUser(user);
console.log("user1:",user);
window.location.hash = window.location.hash;
setAuthState({ authState: "signedIn",user: user });
break;
case "cognitoHostedUI_failure":
setAuthState({ authState: "signedOut",user: null,error: data });
console.log("cognitoHostedUI_failure");
break;
default:
break;
}
});
// if the URL contains ?identity_provider=x,and the user is signed out,we redirect to the IdP on load
const urlParams = new URLSearchParams(window.location.search);
const idpParamName = "identity_provider";
const idp = urlParams.get(idpParamName);
try {
user = await getUser();
setUser(user);
console.log("user2:",user);
// remove identity_provider query param (not needed if signed in successfully)
if (idp) {
urlParams.delete(idpParamName);
const params = urlParams.toString();
window.history.replaceState(
null,null,window.location.pathname + (params ? "?" + params : "")
);
}
setAuthState({ authState: "signedIn",user: user });
} catch (e) {
// user is not authenticated,and we have an IdP in the request
if (e === "not authenticated" && idp) {
await Auth.federatedSignIn({ customProvider: idp });
} else {
console.warn(e);
console.log("not authenticated",e);
setAuthState({ authState: "signedOut",user: null });
}
}
};
const getUser = async () => {
let cognitoUser = await Auth.currentAuthenticatedUser();
return new User(cognitoUser);
};
有什么建议吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。