浏览代码

docs: add plugin-login-auth

zhangyuhan 1 年之前
父节点
当前提交
9cef4b830b
共有 5 个文件被更改,包括 82 次插入0 次删除
  1. 82 0
      docs/plugin-login-auth/introduce.md
  2. 二进制
      docs/plugin-login-auth/model-1.png
  3. 二进制
      docs/plugin-login-auth/model-2.png
  4. 二进制
      docs/plugin-login-auth/outline.png
  5. 二进制
      docs/plugin-login-auth/ui.png

+ 82 - 0
docs/plugin-login-auth/introduce.md

@@ -0,0 +1,82 @@
+# plugin-login-auth
+
+登录弹窗插件,重构于历史PC端网站登录弹窗相关业务 `login.js`。
+
+## UI效果
+![ui.png](ui.png)
+
+## 业务逻辑梳理
+![model-1.png](model-1.png)
+![model-2.png](model-2.png)
+
+## 设计概要
+![outline.png](outline.png)
+
+## 重构进度
+
+### 已完成
+1. 登录
+2. 注册
+3. 设置密码
+4. 微信登录
+5. 绑定手机号(UI及逻辑)
+
+### 待办
+1. 绑定手机号业务
+2. 其他登录后业务
+
+```
+/**
+ * 统一业务成功后分发处理
+ *
+ * 历史业务逻辑梳理:
+ * 0. 是否需要设置密码(前置处理,不进入该分发,只更新用户信息)
+ * 1. 处理返回值,统一格式
+ * 2. 按顺序依次处理历史业务
+ *  2.0 更新用户头像等状态【已提髙到前置处理】
+ *  2.1 是否需要 set Cookies
+ *  2.2 是否需要重新登录
+ *  2.3 是否需要绑定手机号
+ *  2.4 TODO 是否需要新窗口打开<新用户兴趣偏好设置页面>
+ *  2.5 TODO 是否需要展示新用户引导 pc-guide
+ *  2.6 TODO 历史全局状态维护 【迁移SDK新方式】
+ *  2.7 TODO 消息提示获取
+ * 3. TODO 其他业务 原 processpage 函数
+ *  3.1 登录后返回指定URL
+ *  3.2 登录后特定页面操作
+ * 4. TODO 原全局 loginCallback 回调 【迁移SDK新方式】
+ */
+```
+
+## 使用
+
+### 引用
+```
+<script src='{{Cdn}}/jyseo/js/jy-login.umd.js?v={{Msg "version"}}'></script>
+```
+
+### 初始化
+
+已默认检测 `@core/emiiter` 并挂载 `window.jyCoreSDK`,注入 `login` 插件。
+
+```js
+this.instance = window.jyCoreSDK.$plugins['login'].getInstance()
+this.instance.init({
+    preloadLoginState: true
+})
+
+// Hooks 登录相关回调绑定
+function bindHooks () {
+  window.jyCoreSDK.$on('user-login-success', this.handleLoginSuccess.bind(this))
+  window.jyCoreSDK.$on('user-sign-out', this.handleSignOut.bind(this))
+  window.jyCoreSDK.$on('user-info-update', this.handleInfoUpdate.bind(this))
+}
+
+```
+
+
+## 应用场景记录
+
+| 版本 | 日期    | 说明 |
+| ---- | ------- |--|
+| v1.0.1   | 2023-11 | jyseo、bxseo、jycms 项目已集成 |

二进制
docs/plugin-login-auth/model-1.png


二进制
docs/plugin-login-auth/model-2.png


二进制
docs/plugin-login-auth/outline.png


二进制
docs/plugin-login-auth/ui.png