优化登录验证、退出逻辑

back/api/auth.ts

@@ -46,6 +46,14 @@ export default (app: Router) => {
                 config.secret as any,
                 { expiresIn: 60 * 60 * 24 * 7, algorithm: 'HS384' },
               );
+              fs.writeFileSync(
+                config.authConfigFile,
+                JSON.stringify({
+                  username: authInfo.username,
+                  password: authInfo.password,
+                  token,
+                }),
+              );
               res.send({ code: 200, token });
             } else {
               res.send({ code: 400, msg: config.authError });
@@ -61,6 +69,30 @@ export default (app: Router) => {
     },
   );
 
+  route.post(
+    '/logout',
+    async (req: Request, res: Response, next: NextFunction) => {
+      const logger: Logger = Container.get('logger');
+      try {
+        fs.readFile(config.authConfigFile, 'utf8', function (err, data) {
+          if (err) console.log(err);
+          const authInfo = JSON.parse(data);
+          fs.writeFileSync(
+            config.authConfigFile,
+            JSON.stringify({
+              username: authInfo.username,
+              password: authInfo.password,
+            }),
+          );
+          res.send({ code: 200 });
+        });
+      } catch (e) {
+        logger.error('🔥 error: %o', e);
+        return next(e);
+      }
+    },
+  );
+
   route.post(
     '/user',
     async (req: Request, res: Response, next: NextFunction) => {
@@ -76,4 +108,21 @@ export default (app: Router) => {
       }
     },
   );
+
+  route.get(
+    '/user',
+    async (req: Request, res: Response, next: NextFunction) => {
+      const logger: Logger = Container.get('logger');
+      try {
+        fs.readFile(config.authConfigFile, 'utf8', (err, data) => {
+          if (err) console.log(err);
+          const authInfo = JSON.parse(data);
+          res.send({ code: 200, data: { username: authInfo.username } });
+        });
+      } catch (e) {
+        logger.error('🔥 error: %o', e);
+        return next(e);
+      }
+    },
+  );
 };

back/loaders/express.ts

@@ -4,6 +4,7 @@ import cors from 'cors';
 import routes from '../api';
 import config from '../config';
 import jwt from 'express-jwt';
+import fs from 'fs';
 
 export default ({ app }: { app: Application }) => {
   app.enable('trust proxy');
@@ -16,6 +17,22 @@ export default ({ app }: { app: Application }) => {
       path: ['/api/login'],
     }),
   );
+  app.use((req, res, next) => {
+    if (req.url && req.url.includes('/api/login')) {
+      return next();
+    }
+    const data = fs.readFileSync(config.authConfigFile, 'utf8');
+    const authHeader = req.headers.authorization;
+    if (data) {
+      const { token } = JSON.parse(data);
+      if (token && authHeader.includes(token)) {
+        return next();
+      }
+    }
+    const err: any = new Error('UnauthorizedError');
+    err['status'] = 401;
+    next(err);
+  });
   app.use(config.api.prefix, routes());
 
   app.use((req, res, next) => {

src/app.tsx

@@ -0,0 +1,27 @@
+import { history } from 'umi';
+import { request } from '@/utils/http';
+import config from '@/utils/config';
+
+export function render(oldRender: any) {
+  if (history.location.pathname === '/login') {
+    oldRender();
+  }
+  request
+    .get(`${config.apiPrefix}user`)
+    .then((data) => {
+      if (data.data && data.data.username) {
+        return oldRender();
+      }
+      localStorage.removeItem(config.authKey);
+      history.push('/login');
+      oldRender();
+    })
+    .catch((e) => {
+      console.log(e);
+      if (e.response.status === 401) {
+        localStorage.removeItem(config.authKey);
+        history.push('/login');
+        oldRender();
+      }
+    });
+}

src/layouts/index.tsx

@@ -11,12 +11,15 @@ import { Link, history } from 'umi';
 import { LogoutOutlined } from '@ant-design/icons';
 import config from '@/utils/config';
 import 'codemirror/mode/shell/shell.js';
+import { request } from '@/utils/http';
 import './index.less';
 
 export default function (props: any) {
   const logout = () => {
-    localStorage.removeItem(config.authKey);
+    request.post(`${config.apiPrefix}logout`).then(() => {
-    history.push('/login');
+      localStorage.removeItem(config.authKey);
+      history.push('/login');
+    });
   };
 
   useEffect(() => {

src/utils/http.ts

@@ -28,11 +28,6 @@ _request.interceptors.request.use((url, options) => {
 
 _request.interceptors.response.use(async (response) => {
   const res = await response.clone();
-  if (res.status === 401) {
-    setTimeout(() => {
-      history.push('/login');
-    });
-  }
   return response;
 });