keycloak signin

src/SignOut.jsx

@@ -6,14 +6,13 @@ import { useQuery } from "@tanstack/react-query";
 import { Title } from "./components/Title";
 
 export function SignOut() {
-  const logOut = async () => {
-    await api.post("accounts/logout/");
-
+  const logOut = () => {
+    localStorage.removeItem('access_token');
     setAuth(false);
   };
 
   const { data } = useQuery(["profile"], async () => {
-    const { data } = await api.get("/accounts/profile/");
+    const { data } = await api.get("/api/me/");
     return data;
   });
 
@@ -22,7 +21,7 @@ export function SignOut() {
       <Popover
         content={
           <>
-            <Title text={data?.email} classNameText={"lowercase"} />
+            <Title text={data?.username} classNameText={"lowercase"} />
             <Button type="primary" block onClick={logOut}>
               <span className="mr-1">Выйти</span>
               <ArrowRightOutlined />

src/api.js

@@ -15,9 +15,15 @@ export const api = axios.create({
     import.meta.env.MODE === "development"
       ? "http://localhost:5173/"
       : BASE_URL,
-  withCredentials: true,
-  xsrfHeaderName: "X-CSRFToken",
-  xsrfCookieName: "csrftoken",
+});
+
+api.interceptors.request.use(function (config) {
+  const token = localStorage.getItem("access_token");
+  if (token) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+
+  return config;
 });
 
 export const useDbTableName = () => {
@@ -215,7 +221,7 @@ export const useGetPermissions = () => {
   return useQuery(["permissions"], async () => {
     const { data } = await api.get("/api/me/");
 
-    if (data?.groups?.includes("Редактор")) {
+    if (data?.groups?.includes("postnet_editor")) {
       return "editor";
     }
 

src/pages/Login.jsx

@@ -10,8 +10,9 @@ function LoginForm() {
   const signinError = useStore(signinError$);
   const signinLoading = useStore(signinLoading$);
 
-  const onFinish = (values) => {
-    signin(values);
+  const onFinish = async (values) => {
+    const data = await signin(values);
+    localStorage.setItem("access_token", data.access_token);
   };
 
   return (

src/stores/auth.js

@@ -11,7 +11,7 @@ export const setAuth = action(isAuthorized$, "setAuth", (store, newValue) => {
 
 async function checkAuth() {
   try {
-    await api.get("/accounts/profile/");
+    await api.get("/api/me/");
 
     setAuth(true);
   } catch (e) {

src/stores/signin.js

@@ -32,7 +32,20 @@ export async function signin(values) {
   signinError$.set("");
 
   try {
-    const { data } = await api.post("accounts/login/", values);
+    const { data } = await api.request({
+      url: "/realms/SST/protocol/openid-connect/token",
+      method: "POST",
+      data: {
+        "grant_type": "password",
+        client_id: "postnet",
+        client_secret: "K2yHweEUispkVeWn03VMk843sW2Moic5",
+        username: values.login,
+        password: values.password,
+      },
+      headers: {
+        'Content-type': 'application/x-www-form-urlencoded',
+      },
+    });
 
     setAuth(true);
     return data;

vite.config.ts

@@ -11,8 +11,8 @@ export default defineConfig(({ mode }) => {
     plugins: [svgr(), react()],
     server: {
       proxy: {
-        "/account": env.VITE_API_URL,
         "/api": env.VITE_API_URL,
+        "/realms": "https://kk.dev.selftech.ru/",
       },
     },
     css: {