App.vue 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262
  1. <script>
  2. import config from '@/config.js'
  3. import Vue from 'vue'
  4. import { checkUserFamily, verifyToken, bindReferralIfNotSelf, request } from './utils/api.js'
  5. Vue.prototype.$config = config
  6. export default {
  7. onLaunch: function(options) {
  8. console.log('App Launch', options)
  9. // 捕获分享/邀请参数(普通分享链接 ?inviteCode=xxx):未登录写入 storage 供注册登录后绑定推荐人,已登录直接绑定
  10. this.captureReferralParams(options)
  11. // 分享/深链冷启动(携带分享参数)放行到落地页,不套 splash,避免分享的文章/小程序页面打不开
  12. // inviteCode=推荐码(文章/活动/商品分享)| refCode=推广码 | token/familyInviteCode=家庭邀请令牌 | id=内容详情
  13. var hasDeepLink = options && options.query && (
  14. options.query.inviteCode || options.query.refCode || options.query.token ||
  15. options.query.familyInviteCode || options.query.id
  16. )
  17. // 冷启动:跳转到 splash 页展示过渡动画,2秒后自动进入首页
  18. if (options.scene !== 1047 && options.scene !== 1048 && options.scene !== 1049 && !hasDeepLink) {
  19. uni.setStorageSync('_isFirstLaunch', '1')
  20. uni.redirectTo({ url: '/pages/splash/index' })
  21. return
  22. }
  23. // 处理小程序码场景值(从 wxacode 扫码进入,跳过 splash)
  24. this.handleScene(options)
  25. // TabBar 始终显示 5 个底签,不因登录状态隐藏
  26. const token = uni.getStorageSync('token')
  27. if (token) {
  28. this.$store.commit('setToken', token)
  29. // 启动时校验 token 是否仍有效:过期则清理本地登录态并引导重新登录
  30. this.verifyStoredToken()
  31. // 冷启动恢复 familyId(登录时已持久化,hasFamily getter 依赖)
  32. var storedFamilyId = uni.getStorageSync('familyId')
  33. if (storedFamilyId) {
  34. this.$store.commit('setFamilyId', storedFamilyId)
  35. } else {
  36. // 历史用户(8ddc5b55 后未重新登录):本地无 familyId,从接口恢复
  37. this.restoreFamilyIdFromApi()
  38. }
  39. } else {
  40. // 无token时尝试自动登录
  41. this.tryAutoLogin()
  42. }
  43. },
  44. onShow: function(options) {
  45. console.log('App Show', options)
  46. // 热启动(含从分享卡重新进入):同样捕获分享参数
  47. this.captureReferralParams(options)
  48. // 每次 app 展示时也检查场景值(小程序码可能从冷启动后的 onShow 传入)
  49. this.handleScene(options)
  50. // 同步 storage → Vuex(防止 reLaunch/navigateTo 后 Vuex 未更新的问题)
  51. var token = uni.getStorageSync('token')
  52. if (token && token !== this.$store.state.token) {
  53. this.$store.commit('setToken', token)
  54. this.$store.commit('setFamilyId', uni.getStorageSync('familyId'))
  55. }
  56. },
  57. onHide: function() {
  58. console.log('App Hide')
  59. },
  60. methods: {
  61. // 捕获分享/邀请参数:普通分享链接 /pages/xxx?refCode=yyy 冷/热启动进入时,
  62. // 新用户(未登录)写入 storage,登录注册后由 login / user-edit 消费绑定推荐人;
  63. // 已登录用户直接绑定(boundInviteCode 防重,避免重复请求)
  64. captureReferralParams(options) {
  65. if (!options || !options.query) return
  66. var query = options.query
  67. // 推荐码统一为 refCode;inviteCode 兼容历史分享链接(旧 share-mixin 用 inviteCode 承载推荐码)
  68. var code = query.refCode || query.inviteCode
  69. if (!code) return
  70. if (uni.getStorageSync('token')) {
  71. var bound = uni.getStorageSync('boundInviteCode')
  72. if (bound === code) return
  73. bindReferralIfNotSelf(code).then(function(res) {
  74. if (res && (res.code === 200 || res.code === 400)) {
  75. uni.setStorageSync('boundInviteCode', code)
  76. console.log('分享参数推荐人绑定结果', res.code, code)
  77. }
  78. }).catch(function(e) {
  79. console.log('分享参数推荐人绑定失败', e)
  80. })
  81. return
  82. }
  83. uni.setStorageSync('refCode', code)
  84. if (options.query.inviteType) {
  85. uni.setStorageSync('inviteType', options.query.inviteType)
  86. }
  87. },
  88. // 校验本地 token 是否有效(开发环境跳过,避免无后端时误报)
  89. verifyStoredToken() {
  90. try {
  91. var envInfo = uni.getAccountInfoSync()
  92. if (envInfo && envInfo.miniProgram && envInfo.miniProgram.envVersion === 'develop') {
  93. return
  94. }
  95. } catch (e) { /* 非小程序环境 */ }
  96. var self = this
  97. request('/api/auth/verify', 'POST').then(function() {
  98. // token 有效,无需处理
  99. }).catch(function(e) {
  100. // 401:由 request 封装统一触发 _handle401(静默 auto-login 续期或清空重登录)
  101. // _handle401 内部已有完整逻辑:用缓存 openid auto-login → 成功则重放原请求;失败则清空并跳登录页
  102. // 其它错误(如网络失败)静默忽略,不打扰用户
  103. console.log('[App] token 校验未通过:', e && e.code)
  104. })
  105. },
  106. // 从接口恢复 familyId(历史用户冷启动,本地无 familyId 缓存)
  107. restoreFamilyIdFromApi() {
  108. var self = this
  109. checkUserFamily().then(function(res) {
  110. if (res && res.data && res.data.inFamily && res.data.familyId) {
  111. self.$store.commit('setFamilyId', res.data.familyId)
  112. console.log('[App] familyId 已从接口恢复:', res.data.familyId)
  113. }
  114. }).catch(function(e) {
  115. console.log('[App] familyId 接口恢复失败(页面按无家庭态渲染)', e)
  116. })
  117. },
  118. async tryAutoLogin() {
  119. // 开发环境下跳过自动登录,避免无后端时 10s 超时阻塞
  120. try {
  121. var envInfo = uni.getAccountInfoSync()
  122. if (envInfo && envInfo.miniProgram && envInfo.miniProgram.envVersion === 'develop') {
  123. return
  124. }
  125. } catch (e) { /* 非小程序环境 */ }
  126. try {
  127. // 1. 先尝试用缓存的openid自动登录
  128. const cachedOpenid = uni.getStorageSync('openid')
  129. if (cachedOpenid) {
  130. const res = await this.request('/api/auth/auto-login', 'POST', { openid: cachedOpenid })
  131. if (res && res.data) {
  132. this.saveLoginInfo(res.data)
  133. console.log('openid自动登录成功')
  134. // 刷新页面到登录态
  135. uni.switchTab({ url: '/pages/index-home/index' })
  136. return
  137. }
  138. }
  139. // 2. openid自动登录失败,不自动调用uni.login(避免DevTools环境超时阻塞渲染层)
  140. // 用户会看到登录页,手动选择登录方式
  141. } catch (e) {
  142. console.log('自动登录失败,需要手动登录', e)
  143. }
  144. },
  145. saveLoginInfo(data) {
  146. uni.setStorageSync('token', data.token)
  147. uni.setStorageSync('userId', data.userId)
  148. uni.setStorageSync('role', data.role)
  149. // 自动登录后重置到真实登录角色,避免残留切换状态
  150. uni.setStorageSync('currentRole', data.role)
  151. uni.setStorageSync('isSwitchedChild', false)
  152. uni.setStorageSync('isSwitchedTeacher', false)
  153. if (data.openid) {
  154. uni.setStorageSync('openid', data.openid)
  155. }
  156. // familyId 必须持久化:家庭在注册时已由后端创建,缺失会导致页面误判无家庭而重复创建
  157. uni.setStorageSync('userInfo', {
  158. nickname: data.nickname,
  159. userId: data.userId,
  160. familyId: data.familyId
  161. })
  162. this.$store.commit('setToken', data.token)
  163. // 同步 familyId 到 store(hasFamily getter 依赖;auto-login 路径)
  164. this.$store.commit('setFamilyId', data.familyId)
  165. },
  166. request(url, method, data) {
  167. return new Promise((resolve, reject) => {
  168. uni.request({
  169. url: config.api(url),
  170. method: method,
  171. data: data,
  172. timeout: 10000,
  173. header: { 'Content-Type': 'application/json' },
  174. success: (res) => {
  175. if (res.data.code === 200) {
  176. resolve(res.data)
  177. } else {
  178. reject(res.data)
  179. }
  180. },
  181. fail: reject
  182. })
  183. })
  184. },
  185. // 处理小程序码场景值,跳转到邀请页
  186. handleScene(options) {
  187. if (!options || !options.query) return
  188. var scene = options.query.scene
  189. if (!scene) return
  190. var sceneDecoded = decodeURIComponent(scene)
  191. if (sceneDecoded.indexOf('invite=') === 0) {
  192. var token = sceneDecoded.substring(7)
  193. uni.navigateTo({
  194. url: '/pages/invite/join?token=' + token
  195. })
  196. } else if (sceneDecoded.indexOf('ref=') === 0) {
  197. var refCode = sceneDecoded.substring(4)
  198. if (!refCode) {
  199. console.warn('推广码场景缺少 refCode', sceneDecoded)
  200. return
  201. }
  202. uni.navigateTo({
  203. url: '/pages/invite/join?refCode=' + encodeURIComponent(refCode)
  204. })
  205. }
  206. }
  207. }
  208. }
  209. </script>
  210. <style>
  211. @import url('./common/uni.css');
  212. page {
  213. background-color: var(--bg, #F5F9FC);
  214. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
  215. 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
  216. 'Helvetica Neue', Helvetica, Arial, sans-serif;
  217. color: var(--text, #1E293B);
  218. font-size: 28rpx;
  219. line-height: 1.6;
  220. -webkit-font-smoothing: antialiased;
  221. }
  222. /* 页面容器 */
  223. .page {
  224. padding: 0 32rpx 32rpx;
  225. min-height: 100vh;
  226. }
  227. .page--no-padding {
  228. padding: 0;
  229. }
  230. /* 分段标题 */
  231. .section-header {
  232. font-weight: 700;
  233. font-size: 32rpx;
  234. margin: 32rpx 0 16rpx;
  235. color: var(--text, #1E293B);
  236. display: flex;
  237. align-items: center;
  238. justify-content: space-between;
  239. border-left: 8rpx solid #F08A7A;
  240. padding-left: 20rpx;
  241. }
  242. .section-header__more {
  243. font-size: 24rpx;
  244. color: var(--muted, #94A3B8);
  245. font-weight: 400;
  246. }
  247. /* 安全区底部 */
  248. .safe-area-bottom {
  249. padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
  250. padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
  251. }
  252. </style>