Fix session persistence issue

- Created SSR-safe tokenStorage utility for localStorage access
- Updated AuthContext with window availability checks
- Enhanced API client interceptors with SSR safety
- Improved error handling to only clear tokens on auth errors (401/403)
- Added token refresh support for multiple response structures
- Added redirect loop prevention in auth flow

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
andupetcu
2025-09-30 21:57:37 +03:00
parent b6ed413e0c
commit b48aaded05
3 changed files with 173 additions and 24 deletions

View File

@@ -1,4 +1,5 @@
import axios from 'axios';
import { tokenStorage } from '@/lib/utils/tokenStorage';
const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000';
@@ -13,7 +14,7 @@ export const apiClient = axios.create({
// Request interceptor to add auth token
apiClient.interceptors.request.use(
(config) => {
const token = localStorage.getItem('accessToken');
const token = tokenStorage.getAccessToken();
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
@@ -30,31 +31,65 @@ apiClient.interceptors.response.use(
async (error) => {
const originalRequest = error.config;
// Only handle token refresh on client side
if (typeof window === 'undefined') {
return Promise.reject(error);
}
// If error is 401 and we haven't tried to refresh yet
if (error.response?.status === 401 && !originalRequest._retry) {
originalRequest._retry = true;
try {
const refreshToken = localStorage.getItem('refreshToken');
const refreshToken = tokenStorage.getRefreshToken();
if (!refreshToken) {
throw new Error('No refresh token');
}
const response = await axios.post(`${API_BASE_URL}/api/v1/auth/refresh`, {
refreshToken,
});
const response = await axios.post(
`${API_BASE_URL}/api/v1/auth/refresh`,
{ refreshToken },
{
headers: { 'Content-Type': 'application/json' },
withCredentials: true
}
);
const { accessToken } = response.data;
localStorage.setItem('accessToken', accessToken);
// Handle different response structures
let newAccessToken;
let newRefreshToken;
if (response.data?.data?.tokens?.accessToken) {
newAccessToken = response.data.data.tokens.accessToken;
newRefreshToken = response.data.data.tokens.refreshToken;
} else if (response.data?.tokens?.accessToken) {
newAccessToken = response.data.tokens.accessToken;
newRefreshToken = response.data.tokens.refreshToken;
} else if (response.data?.accessToken) {
newAccessToken = response.data.accessToken;
newRefreshToken = response.data.refreshToken;
} else {
throw new Error('Invalid token refresh response');
}
// Update tokens in storage
tokenStorage.setAccessToken(newAccessToken);
if (newRefreshToken) {
tokenStorage.setRefreshToken(newRefreshToken);
}
// Retry original request with new token
originalRequest.headers.Authorization = `Bearer ${accessToken}`;
originalRequest.headers.Authorization = `Bearer ${newAccessToken}`;
return apiClient(originalRequest);
} catch (refreshError) {
console.error('Token refresh failed:', refreshError);
// Refresh failed, clear tokens and redirect to login
localStorage.removeItem('accessToken');
localStorage.removeItem('refreshToken');
window.location.href = '/login';
tokenStorage.clearTokens();
// Avoid redirect loop - only redirect if not already on login page
if (!window.location.pathname.includes('/login')) {
window.location.href = '/login';
}
return Promise.reject(refreshError);
}
}