Метод проверки пользователя с JWT в React и C# ⇐ Javascript

[Anonymous]

Я разрабатываю приложение в реагирование с бэкэнд в C#, для проверки зарегистрированных пользователей бэкэнд возвращает мне JWT в логине, и я сохраняю его в файлах cookie с параметрами безопасности (безопасная, одно и той же сит. : Строгие, только HTTP и другие), и с каждым запросом в системе он убивает предыдущий JWT и создает новый в последовательном потоке, но если я нажму F5 на странице, он не может получить jwt, потому что он имеет параметр только для HTTP, и я в конечном итоге выбит со страницы. Я пытался сделать некоторую логику, используя контекст, но я не мог решить часть обновления страницы, мне нужна подлинная помощь. , поэтому, когда он обновляется, я восстанавливаю последнюю сохраненные файлы cookie, используя значение состояния по умолчанию, но мне нужен только HTTP для PCI-DSS)
ниже мой закрытый Код маршрута это Завершает мои экраны (это может показаться грязным кодом, и это действительно так, но это был единственный способ закрепить пользователя так, как он разработал логику JWT) :
const PrivateRoute = ({ children }) => {
const [isAuthenticated, setIsAuthenticated] = useState(null);
const [token, setToken] = useState(Cookies.get('authToken'));
const [isSessionLoaded, setIsSessionLoaded] = useState(false); // Novo estado
const location = useLocation();

const { userSession, tokenResponse, setTokenResponse, setTokenAtual, tokenAtual, setUserSession } = useAuthContext();

const navigate = useNavigate();

const validation = async () => {
try {
const response = await validateTokenJWT(token);
if (response.data) {
setIsAuthenticated(true);
return response.data;
} else {
Cookies.remove("authToken");
setIsAuthenticated(false);
return navigate("/");
}
} catch (e) {
console.log(e);
return navigate("/");
}
};

const validationFirstTime = async () => {
try {
const response = await validateTokenJWT(tokenResponse);
if (response.data) {
setIsAuthenticated(true);
return response.data;
} else {
Cookies.remove("authToken");
setIsAuthenticated(false);
return navigate("/");
}
} catch (e) {
console.log(e);
return navigate("/");
}
};

useEffect(() => {
const checkToken = async () => {
if (tokenResponse) {
const newToken = await validationFirstTime();
setTokenResponse(null);
if (newToken && newToken !== token) {
setTokenAtual(newToken);
setToken(newToken);
Cookies.set("authToken", newToken, {
expires: new Date(new Date().getTime() + 15 * 60 * 1000),
path: "/",
sameSite: "Strict", // Previne ataques CSRF
secure: true, // Garante que o cookie só seja transmitido via HTTPS
});

systemname.interceptors.request.use(
(config) => {
const token = newToken;
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
},
(error) => {
return Promise.reject(error);
}
);

} else {
Cookies.remove("authToken");
setIsAuthenticated(false);
return navigate("/");
}
} else {
if (token) {
const newToken = await validation();
if (newToken && newToken !== token) {
setTokenAtual(newToken);
setToken(newToken);
Cookies.set("authToken", newToken, {
expires: new Date(new Date().getTime() + 15 * 60 * 1000),
path: "/",
sameSite: "Strict", // Previne ataques CSRF
secure: true, // Garante que o cookie só seja transmitido via HTTPS
});

systemname.interceptors.request.use(
(config) => {
const token = newToken;
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
},
(error) => {
return Promise.reject(error);
}
);
}
} else {
Cookies.remove("authToken");
setIsAuthenticated(false);
return navigate("/");
}
}
};

checkToken();
}, [location.pathname]);

useEffect(() => {
const checkUserSession = async () => {
if (tokenAtual) {
try {
const response = await getUserByAuthToken();
if (response.data) {
setUserSession(response.data);
setIsSessionLoaded(true);
}
} catch (error) {
console.log(error);
}
}
};
checkUserSession();
}, [tokenAtual]);

useEffect(() => {
if (isSessionLoaded) {
const routeName = window.location.pathname.split("/").pop();
const permissions = userSession?.screens;

const permissionFound = permissions.map((screen) => {
if (screen.userScreenId === routeName) {
return true;
} else {
return false;
}
});

const hasPermission = permissionFound.includes(true);

if (!isAuthenticated) {
navigate("/");
} else if (!hasPermission) {
navigate("/AccesDenied");
}
}
}, [isSessionLoaded, userSession, isAuthenticated, navigate]);

if (isAuthenticated === null) {
return (
style={{
display: "flex",
justifyContent: "center",
alignItems: "center",
height: "100vh",
}}
>


);
}

return children;
};

export default PrivateRoute;
< /code>
Я попробовал все, мне нужна помощь, я также ищу другое решение, чтобы сделать это, даже если это означает удаление токена из cookie ( это было бы еще лучше)

Подробнее здесь: https://stackoverflow.com/questions/794 ... nd-c-sharp