<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>工作 on Yosgi Blog</title><link>https://siqi-liu.com/zh/categories/%E5%B7%A5%E4%BD%9C/</link><description>Recent content in 工作 on Yosgi Blog</description><generator>Hugo</generator><language>zh</language><lastBuildDate>Fri, 12 Jun 2026 04:28:42 +0000</lastBuildDate><atom:link href="https://siqi-liu.com/zh/categories/%E5%B7%A5%E4%BD%9C/index.xml" rel="self" type="application/rss+xml"/><item><title>关于登陆注册需求的复盘</title><link>https://siqi-liu.com/zh/post/%E5%85%B3%E4%BA%8E%E7%99%BB%E9%99%86%E6%B3%A8%E5%86%8C%E9%9C%80%E6%B1%82%E7%9A%84%E5%A4%8D%E7%9B%98/</link><pubDate>Sun, 21 Feb 2021 00:00:00 +0000</pubDate><guid>https://siqi-liu.com/zh/post/%E5%85%B3%E4%BA%8E%E7%99%BB%E9%99%86%E6%B3%A8%E5%86%8C%E9%9C%80%E6%B1%82%E7%9A%84%E5%A4%8D%E7%9B%98/</guid><description>年前公司登陆注册的需求，预估一个月的工期，结果在过程中项目变得不可控，最后完成用了几乎三个月，为了不辜负这段时间的加班，故复盘一下项目完成的过程。 关于需求评审 先简单回顾一下需求，注册 / 登陆 都有三个通道 ： 账号/密码 ，手机号，三方 （包括微信扫码和，QQ授权，微博授权），通过一系列的规则和引导，最终走到 登陆/注册 成功页面 ， 再跳转到来源网页。 需要完成的包括 PC 端，移动端 以及 微信端 其中移动端和微信端的区别很小，只有能否微信扫码登录的区别。 看起来简单明了的需求，貌似很多逻辑都能复用，所以 PC 端 估半个月，移动端估一周，剩下的用来IE适配和解决问题。 关于技术选型 因为涉及到微信扫码登录，后端提议接口使用轮询的方式，我不断去轮询状态的接口从而获取状态，比如微信登陆的流程，需要微信扫码 &gt; 获取手机号 &gt; 引导关注公众号 &gt; 创建 / 绑定 网站账号 的流程，那么大致对应着后端给我的 4 个字段，而我由字段的存在与否来判断进入哪个路由。 遇到了哪些问题，及解决方案 老代码 老代码用屎山来形容毫不为过，页面由各种html 内连 css / js 和php 语句拼凑而成，一个页面四五千行的代码，甚至还和其它项目的css 产生着耦合 （引用其公共css )，php 的include 层层嵌套，在深层中还存在着JS的逻辑（我唯一保留的一点三方登陆的老代码在后面引入了难以排查的bug） 解决办法是对前端进行了重构，一开始为了把多个页面的逻辑写进一个PHP文件中，监听浏览器的hash值改变路由，后面发现每个路由都存在自己的初始化逻辑，于是又加上了简单的生命周期。 后面又发现有复用组件的需求，干脆上了 vue框架，script 标签引入。 代码复用 因为老项目路径的一些原因，import 是无法使用的，只好使用include 来代替。 需要复用的变量全部做成全局，用 symbol 或者 单例 防止变量污染。 vue 的模板写在一个html文件，逻辑部分用 x-template 的 script 标签 include 引入 vue的模板代码。</description></item></channel></rss>