SK-278 added storing of refresh_token, moved auth flow to http

.env.example

@@ -1,4 +1,6 @@
 REACT_APP_SOCKET_CONNECT=ws://localhost:9001
 REACT_APP_PUBLIC_VAPID_KEY=key
 
-REACT_APP_MESSAGES_COUNT_TO_PRELOAD=30
+REACT_APP_MESSAGES_COUNT_TO_PRELOAD=30
+
+REACT_APP_DEVELOPMENT=true

src/App.js

@@ -80,8 +80,7 @@ export default function App() {
         dispatch(setSelectedConversation({}));
       }
       if (history.location.pathname === "/authorization") {
-        const token = localStorage.getItem("sessionId");
-        autoLoginService.userLogin(token);
+        autoLoginService.userLoginByToken();
       }
     });
 

src/api/api.js

@@ -1,3 +1,4 @@
+import buildHttpUrl from "@utils/navigation/build_http_url";
 import getBrowserFingerprint from "get-browser-fingerprint";
 import getUniqueId from "@api/uuid";
 import { default as EventEmitter } from "@event/eventEmitter";
@@ -18,6 +19,10 @@ class Api {
     this.onConversationCreateListener = null;
     this.onConversationUpdateListener = null;
     this.onConversationDeleteListener = null;
+    this.deviceId = getBrowserFingerprint({
+      enableScreen: false,
+      hardwareOnly: true,
+    }).toString();
   }
 
   async connect() {
@@ -170,29 +175,35 @@ class Api {
     });
   }
 
-  async userLogin(data) {
+  async sendHttpPromise(method, endpoint, data) {
+    console.log("[http.request]", { request: data });
+
+    const params = {
+      method,
+      credentials: "include",
+      headers: { "Content-Type": "application/json" },
+    };
+    data && (params["body"] = JSON.stringify(data));
+
+    const response = await fetch(`${buildHttpUrl()}/${endpoint}`, params);
+
+    const responseData = await response.json();
+    console.log("[http.response]", { response: responseData });
+
+    return responseData;
+  }
+
+  async connectSocket(data) {
     const requestData = {
       request: {
-        user_login: data.token
-          ? {
-              token: data.token,
-              deviceId: getBrowserFingerprint({
-                enableScreen: false,
-                hardwareOnly: true,
-              }),
-            }
-          : {
-              login: data.login,
-              password: data.password,
-              deviceId: getBrowserFingerprint({
-                enableScreen: false,
-                hardwareOnly: true,
-              }),
-            },
-        id: getUniqueId("userLogin"),
+        connect: {
+          token: data.token,
+          device_id: this.deviceId,
+        },
+        id: getUniqueId("connectSocket"),
       },
     };
-    const resObjKey = null;
+    const resObjKey = "success";
     return this.sendPromise(requestData, resObjKey);
   }
 
@@ -544,10 +555,7 @@ class Api {
           web_endpoint: data.web_endpoint,
           web_key_auth: data.web_key_auth,
           web_key_p256dh: data.web_key_p256dh,
-          device_udid: getBrowserFingerprint({
-            enableScreen: false,
-            hardwareOnly: true,
-          })?.toString(),
+          device_udid: this.deviceId,
         },
         id: getUniqueId("pushSubscriptionCreate"),
       },
@@ -561,10 +569,7 @@ class Api {
     const requestData = {
       request: {
         push_subscription_delete: {
-          device_udid: getBrowserFingerprint({
-            enableScreen: false,
-            hardwareOnly: true,
-          })?.toString(),
+          device_udid: this.deviceId,
         },
         id: getUniqueId("pushSubscriptionDelete"),
       },

src/services/autoLoginService.js

@@ -1,4 +1,5 @@
 import api from "@api/api";
+import buildHttpUrl from "@utils/navigation/build_http_url";
 import navigateTo from "@utils/navigation/navigate_to";
 import showCustomAlert from "@utils/show_alert";
 import store from "@store/store";
@@ -17,25 +18,64 @@ class AutoLoginService {
       if (!token || token === "undefined") {
         return;
       }
-      this.userLogin(token);
+      this.userLoginByToken(token);
     });
   }
 
-  async userLogin(token) {
+  async #sendLoginRequest(data) {
+    const responseData = await api.sendHttpPromise("POST", "login", data);
+    if (responseData.access_token) {
+      await api.connectSocket({ token: responseData.access_token });
+    }
+    return responseData;
+  }
+
+  async userLoginWithHttp(data) {
+    const { login, password, accessToken } = data;
+
+    const requestData = { device_id: api.deviceId };
+    if (login && password) {
+      requestData.login = login;
+      requestData.password = password;
+    } else if (accessToken) {
+      requestData.access_token = accessToken;
+    }
+
+    return await this.#sendLoginRequest(requestData);
+  }
+
+  async userRefreshToken() {
+    const requestData = { device_id: api.deviceId };
+    return await this.#sendLoginRequest(requestData);
+  }
+
+  async userLoginByToken() {
+    const token = localStorage.getItem("sessionId");
+    const currentTime = Date.now();
+    const tokenExpiredAt =
+      localStorage.getItem("sessionExpiredAt") || currentTime;
+
     const currentPath = history.location?.hash;
     const handleLoginFailure = () => {
       localStorage.removeItem("sessionId");
+      localStorage.removeItem("sessionExpiredAt");
       navigateTo("/authorization");
       store.dispatch(setUserIsLoggedIn(false));
     };
 
     try {
-      const { token: userToken, user: userData } = await api.userLogin({
-        token,
-      });
+      const {
+        access_token: userToken,
+        expired_at: accessTokenExpiredAt,
+        user: userData,
+      } = await (tokenExpiredAt - currentTime < 30000
+        ? this.userRefreshToken()
+        : this.userLoginWithHttp({ accessToken: token }));
 
       if (userToken && userToken !== "undefined") {
         localStorage.setItem("sessionId", userToken);
+        localStorage.setItem("sessionExpiredAt", accessTokenExpiredAt);
+
         store.dispatch(setCurrentUserId(userData._id));
         api.curerntUserId = userData._id;
 

src/services/usersService.js

@@ -1,5 +1,6 @@
 import DownloadManager from "@src/adapters/downloadManager";
 import api from "@api/api";
+import autoLoginService from "./autoLoginService";
 import isHeic from "@utils/media/is_heic";
 import processFile from "@utils/media/process_file";
 import showCustomAlert from "@utils/show_alert";
@@ -33,11 +34,16 @@ class UsersService {
       );
     }
 
-    const { token: userToken, user: userData } = await api.userLogin({
+    const {
+      access_token: userToken,
+      expired_at: accessTokenExpiredAt,
+      user: userData,
+    } = await autoLoginService.userLoginWithHttp({
       login: login.trim().toLowerCase(),
       password: password.trim(),
     });
     localStorage.setItem("sessionId", userToken);
+    localStorage.setItem("sessionExpiredAt", accessTokenExpiredAt);
     api.curerntUserId = userData._id;
 
     return userData;
@@ -120,22 +126,33 @@ class UsersService {
   }
 
   async logout() {
-    navigator.serviceWorker.ready
-      .then((reg) =>
-        reg.pushManager.getSubscription().then((sub) =>
-          sub.unsubscribe().then(async () => {
-            await api.pushSubscriptionDelete();
-            await api.userLogout();
-            localStorage.removeItem("sessionId");
-          })
-        )
-      )
-      .catch(async (err) => {
-        console.error(err);
-        await api.userLogout();
-        localStorage.removeItem("sessionId");
-        throw new Error("User logout error");
+    const performLogoutRequest = async () => {
+      const res = await api.sendHttpPromise("POST", "logout", {
+        device_id: api.deviceId,
       });
+
+      if (!res.success) {
+        await api.userLogout();
+      }
+    };
+
+    try {
+      const reg = await navigator.serviceWorker.ready;
+      const sub = await reg.pushManager.getSubscription();
+      if (sub) {
+        await sub.unsubscribe();
+        await api.pushSubscriptionDelete();
+      }
+
+      await performLogoutRequest();
+    } catch (err) {
+      console.error(err);
+      await performLogoutRequest();
+      throw new Error("User logout error");
+    } finally {
+      localStorage.removeItem("sessionId");
+      localStorage.removeItem("sessionExpiredAt");
+    }
   }
 
   async updateUserAvatar(file) {

src/utils/navigation/build_http_url.js

@@ -0,0 +1,6 @@
+export default function buildHttpUrl() {
+  const isSSL = process.env.REACT_APP_DEVELOPMENT === "true";
+  return `http${isSSL ? "" : "s"}://${
+    process.env.REACT_APP_SOCKET_CONNECT.split("//")[1]
+  }`;
+}