下一个JS无法访问localstorage

发布于 2025-01-31 08:57:01 字数 1004 浏览 5 评论 0原文

我使用下一个JS构建应用程序。

通过登录页面对用户进行身份验证时，我可以正常存储访问令牌并刷新令牌。但是，在授权期间，当我尝试从本地存储中获取访问令牌时，我会收到一个错误的错误，称为localStorage。

我猜是因为下一个JS正在呈现服务器端的页面，并且服务器上没有局部距离。

那么，我该如何解决这个问题呢？任何帮助都将被应用。

// Set access token and refresh token to localstorage
const setTokens = (accessToken, refreshToken) => {
  localStorage.setItem("accessToken", accessToken);
  localStorage.setItem("refreshToken", refreshToken);
};

// Get access token from localstorage
const getAccessToken = () => {
  return localStorage.getItem("accessToken");
};

// Get refresh token from localstorage
const getRefreshToken = () => {
  return localStorage.getItem("refreshToken");
};

// Remove access token and refresh token from localstorage
const removeTokens = () => {
  localStorage.removeItem("accessToken");
  localStorage.removeItem("refreshToken");
};

export { setTokens, getAccessToken, getRefreshToken, removeTokens };

从上面的代码中，settoken（）函数正在工作。

原文

I building an application with next JS.

When authenticating the user via login page I can store the access token and refresh token to the local storage normally. But during authorization, when I am trying to get the access token from local storage I am getting an error called localstorage is not defined.

I guess because next JS is rendering the page on the server side, and there is not localstorage on the server.

So, how can I get around this? Any help would be appriciated.

// Set access token and refresh token to localstorage
const setTokens = (accessToken, refreshToken) => {
  localStorage.setItem("accessToken", accessToken);
  localStorage.setItem("refreshToken", refreshToken);
};

// Get access token from localstorage
const getAccessToken = () => {
  return localStorage.getItem("accessToken");
};

// Get refresh token from localstorage
const getRefreshToken = () => {
  return localStorage.getItem("refreshToken");
};

// Remove access token and refresh token from localstorage
const removeTokens = () => {
  localStorage.removeItem("accessToken");
  localStorage.removeItem("refreshToken");
};

export { setTokens, getAccessToken, getRefreshToken, removeTokens };

From above code only setToken() function is working.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

森林很绿却致人迷途 2025-02-07 08:57:01

在使用中使用您的功能

const [accessToken, setAccessToken] = useState(null)
const [refreshToken, setRefreshToken] = useState(null)
useEffect(() => {
  try {
    const accToken = getAccessToken();
    const refToken = getRefreshToken();
    setAccessToken(accToken)
    setRefreshToken(refToken)
  } catch (e) {
  }
}, [])

use your function in useEffect

const [accessToken, setAccessToken] = useState(null)
const [refreshToken, setRefreshToken] = useState(null)
useEffect(() => {
  try {
    const accToken = getAccessToken();
    const refToken = getRefreshToken();
    setAccessToken(accToken)
    setRefreshToken(refToken)
  } catch (e) {
  }
}, [])

回复收藏 0 原文

~没有更多了~