Здравствуйте
коллеги!
Познаю реакт и делаю простую админку для себя, пытаюсь подвязать бек к фронту, но всё глубже укапываюсь в яму.
Проблем несколько, начнем по порядку.
С давних времен использую OpenServer, все проекты лежат в папке domain, как и эта админка в папке admin. Тут солянка из реакта и бека, который лежит в корне в своей папочке api.
Как собираю приложение - оно хостится на
localhost:3000, ну по стандарту корчое, а api на локальном домене (
admin). Выгребся вроде как костылем, но вроде оно и не костыль.
// файл config.js
export const apiUrl = "http://admin/api/";
// файл loginPage.jsx
axios.post(apiUrl + "users/login", data, {withCredentials: true, headers: {"Content-type": "application/json; charset=UTF-8"}})
.then(response => {
if (response.data.status === 'success') {
toast.success(response.data.message);
document.cookie = "token=" + response.data.authToken
setTimeout(()=> {
window.location.href='/';
},1500)
}
else if (response.data.status === 'error') toast.error(response.data.message)
});
Но я благополучно столкнулся с проблемой, когда я пытаюсь использовать
setcookie('token', $authToken)
оно сохраняет куку на локальном домене admin. В принципе - тут тоже костыль нашел, теперь с телом ответа передаю токен и записываю его в куки через JS. Это можно увидеть тоже на снипите кода выше. Костылять не хотелось бы, подскажите грамотное решение плиз.
Ну и вторая проблема, она по-проще наверное. Как мне не пускать юзера на страницы которые он видеть не должен будучи не авторизированным? Пробовал так, но прям жутко видно швы и это ОГРОМНЕЙШИЙ и ужасный костыль.
if (AuthToken === undefined) {
window.location.href = '/login';
} else {
return (
// Компонент
)
Вообщем помогите новичку, не ругайте сильно, знаю что говнокода туча)