我正在使用NextJS 12.0.10
和next-redux-wrapper 7.0.5
以及Axios自定义示例来保存保存在本地存储中的用户JWT令牌,并将其与每个请求一起注入拦截器,也将其注入每个响应中的传入错误
这样做的问题是,我无法在Next数据获取方法中使用Axios示例
因为当在服务器内部调用请求时,无法从本地存储中获取用户JWTToken。此外,我无法在出现故障时跟踪请求并快速发送刷新令牌
我尝试使用cookies,但是getStaticProps
不提供req或resp obj我应该总是使用getServerSideProps
吗
axios.js************
const axiosInstance = axios.create({
baseURL: baseURL,
timeout: 20000,
headers: {
common: {
Authorization: !isServer()
? localStorage.getItem("access_token")
? "JWT " + localStorage.getItem("access_token")
: null
: null,
accept: "application/json",
},
},
});
登录切片. js
export const getCurrentUser = createAsyncThunk(
"auth/getCurrentUser",
async (_, thunkApi) => {
try {
const response = await axiosInstance.get("api/auth/user/");
await thunkApi.dispatch(setCurrentUser(response.data));
return response.data;
} catch (error) {
if (error.response.data) {
return thunkApi.rejectWithValue(error.response.data);
}
toast.error(error.message);
return thunkApi.rejectWithValue(error.message);
}
}
);
页面.jsx
export const getStaticProps = wrapper.getStaticProps((store) => async (ctx) => {
try {
await store.dispatch(getCurrentUser());
} catch (e) {
console.log("here", e);
}
return {
props: {},
};
});
1条答案
按热度按时间dpiehjr41#
服务器端渲染技术是一条单行道,如果你遵循标准的做法。你不会得到任何本地细节-它是cookie,本地存储或本地状态返回到服务器。
我会让服务器尽可能多地构建DOM(即使用空的用户数据),让客户机通过useEffect获取数据。