feat(KIP-6765): KERRY+小程序临停缴费功能未登录身份使用流程

nginx_parking.conf

@@ -47,6 +47,10 @@ server {
         proxy_pass https://api.weixin.qq.com/sns;
     }
 
+    location /cgi-bin {
+        proxy_pass https://api.weixin.qq.com/cgi-bin/;
+    }
+
 
 
     error_page   500 502 503 504  /50x.html;

public/index.html

@@ -14,7 +14,7 @@
   </title>
   <script>
     // CONFIGURATIONS_PLACEHOLDER
-    
+
     if (/dev-/.test(window?.injectConfig?.api) || window.location.href.indexOf(8080) > -1) {
       window.injectConfig = {
         ...window.injectConfig,
@@ -25,7 +25,22 @@
         qaPayment: 'https://qa-payment.kerryonvip.com',
       };
     }
-    
+
+  </script>
+  <script>
+    // const debug = window.localStorage.getItem('H5_DEBUG');
+    // 开发环境和qa环境 打开debug
+    const debug = /dev-|qa-/.test(window?.injectConfig?.api) || window.location.href.indexOf(8080) > -1;
+    if (debug) {
+      const script = document.createElement('script');
+      script.src = 'https://unpkg.com/vconsole@latest/dist/vconsole.min.js';
+      document.head.appendChild(script);
+      script.addEventListener('load', () => {
+        setTimeout(() => {
+          window.vConsole = new window.VConsole();
+        }, 200);
+      });
+    }
   </script>
   <script>
       // var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
@@ -43,18 +58,3 @@
 <!-- <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> -->
 
 </html>
-<script>
-  // const debug = window.localStorage.getItem('H5_DEBUG');
-  // 开发环境和qa环境 打开debug
-  const debug = /dev-|qa-/.test(window?.injectConfig?.api) || window.location.href.indexOf(8080) > -1;
-  if (debug) {
-    const script = document.createElement('script');
-    script.src = 'https://unpkg.com/vconsole@latest/dist/vconsole.min.js';
-    document.head.appendChild(script);
-    script.addEventListener('load', () => {
-      setTimeout(() => {
-        window.vConsole = new window.VConsole();
-      }, 200);
-    });
-  }
-</script>

src/main.js

@@ -36,8 +36,8 @@ import componentsInstall from './components/install';
 // 注册全局组件
 // Vue.use(plugins);
 Vue.use(componentsInstall);
-
-Vue.prototype.$wx = wx;
+window.wx = wx;
+Vue.prototype.$wx = window.wx;
 Vue.prototype.$store = store;
 Vue.prototype.$request = request;
 Vue.prototype.$sensors = sensors;

src/pages/login/openWx.vue

@@ -80,20 +80,20 @@ export default {
     },
     async getOpenId(code) {
       try {
-        this.$store.commit('SET_OPENID', 'odJnI0-Y6ZJap-Ow9nmJH-4WyxhU');
+        /*this.$store.commit('SET_OPENID', 'odJnI0-Y6ZJap-Ow9nmJH-4WyxhU');
         // 判断用户是否需要登录,
         await this.checkIsLogin(() => {
           this.$router.replace({
             path: 'home',
           });
-        });
-        /*// 通过code获取 openId等用户信息，/api/user/wechat/login 为后台接口
+        });*/
+        // 通过code获取 openId等用户信息，/api/user/wechat/login 为后台接口
         const { appid, secret } = getAppIdByGroupIdAndMallId({
           groupId: this.$route.params.groupId,
           mallId: this.$route.params.mallId,
           type: 'all',
         });
-        console.log(86, appid, secret, code);
+        // console.log(86, appid, secret, code);
         // return;
         // ?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
         const res = await WxJsOpenId({
@@ -104,13 +104,15 @@ export default {
         });
         if (res?.expires_in && res?.openid) {
           this.$store.commit('SET_OPENID', res.openid);
+          this.$store.commit('SET_WX_ACCESS_TOKEN', res.access_token);
+          this.$store.commit('SET_WX_REFRESH_TOKEN', res.refresh_token);
           // 判断用户是否需要登录,
           await this.checkIsLogin(() => {
             this.$router.replace({
               path: 'home',
             });
           });
-        }*/
+        }
       } catch (err) {
         console.log(106, err);
       }

src/pages/parkingFee/parkingFeeDetail.vue

@@ -477,18 +477,6 @@ export default {
     //   return;
     // }
     // uni.setStorageSync('isReload', '2');
-    const platform = getPlatform();
-    if (platform === 'micromessenger') {
-      await initWxJsSdkConfig(['chooseWXPay', 'scanQRCode']);
-      try {
-        // if (window.wxJsSdkConfigInitPromise) {
-        //   // console.log(window.wxJsSdkConfigInitPromise);
-        //   // window.wxJsSdkConfigInitPromise;
-        // }
-      } catch (e) {
-        console.log(487, e);
-      }
-    }
     const option = this.$route.query;
     this.picUrl = this.$picUrl;
     this.payCarno = option.carno;
@@ -506,8 +494,20 @@ export default {
     //   return;
     // }
   },
-  activated() {
+  async activated() {
     console.log('activated', uni.getStorageSync('isReload'));
+    const platform = getPlatform();
+    if (platform === 'micromessenger') {
+      await initWxJsSdkConfig(['chooseWXPay', 'scanQRCode']);
+      try {
+        // if (window.wxJsSdkConfigInitPromise) {
+        //   // console.log(window.wxJsSdkConfigInitPromise);
+        //   // window.wxJsSdkConfigInitPromise;
+        // }
+      } catch (e) {
+        console.log(487, e);
+      }
+    }
     // if (uni.getStorageSync('isReload') === '3') {
     //   console.log(487);
     //   this.$router.push({
@@ -1501,7 +1501,7 @@ export default {
     },
     // 支付前
     async toPay() {
-      // await this.weixH5Pay()
+      // await this.weixinH5Pay()
       // return
       this.throttle(() => {
         // 北京特殊处理
@@ -1775,11 +1775,11 @@ export default {
             const platform = getPlatform();
             // TODO: h5环境判断
             if (platform === 'micromessenger') {
-              const weixH5PayRes = await this.weixH5Pay(prepayJson);
+              const weixinH5PayRes = await this.weixinH5Pay(prepayJson);
               // 微信支付完成，判断结果
-              console.log(1784, weixH5PayRes);
+              console.log(1784, weixinH5PayRes);
               //  errMsg: 'requestPayment:ok'
-              if (weixH5PayRes?.errMsg === 'requestPayment:ok') {
+              if (weixinH5PayRes?.errMsg === 'requestPayment:ok') {
                 this.$router.replace({
                   path: 'parkingFeeSuccess?carno=' + this.parkInfo.carno,
                 });
@@ -1902,7 +1902,7 @@ export default {
       this.isShow = !this.isShow;
     },
     // 微信公众号H5支付
-    async weixH5Pay(params) {
+    async weixinH5Pay(params) {
       // console.log(1897);
       if (window?.wxJsSdkConfigInitPromise) {
         await window.wxJsSdkConfigInitPromise;
@@ -1937,7 +1937,7 @@ export default {
       });
     },
     scan() {
-      this.$wx.scanQRCode({
+      wx.scanQRCode({
         desc: 'scanQRCode desc',
         needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
         // scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有

src/pages/parkingFee/parkingFeePaperCoupon.vue

@@ -149,7 +149,8 @@ export default {
   async mounted() {
     const platform = getPlatform();
     if (platform === 'micromessenger') {
-      await initWxJsSdkConfig(['checkJsApi', 'scanQRCode']);
+      this.getTicket();
+      // await initWxJsSdkConfig(['checkJsApi', 'scanQRCode']);
       // if (window.wxJsSdkConfigInitPromise) {
       //   await window.wxJsSdkConfigInitPromise;
       // }
@@ -426,6 +427,54 @@ export default {
       });
       this.$router.back();
     },
+    // h5获取配置---公众号支付
+    getTicket() {
+      let self = this;
+      var datas = {
+        groupId: this.$store.state.groupId,
+        mallid: this.$store.state.mallid,
+        url: window.location.href.split('#')[0],
+      };
+      self.$md(datas);
+      uni.request({
+        url: self.$baseURL + 'api/1.0/login/getTicket',
+        method: 'POST',
+        data: datas,
+        header: JSON.parse(uni.getStorageSync('handleUser')),
+        success: (res) => {
+          if (res.data.code == 0) {
+            self.$wx.config({
+              debug: false, // 开启调试模式
+              appId: res.data.data.appId, // 必填，公众号的唯一标识
+              timestamp: res.data.data.timestamp, // 必填，生成签名的时间戳
+              nonceStr: res.data.data.nonceStr, // 必填，生成签名的随机串
+              signature: res.data.data.signature, // 必填，签名
+              jsApiList: ['chooseWXPay', 'scanQRCode', 'checkJsApi'], // 必填，需要使用的JS接口列表
+            });
+            self.$wx.ready(function () {
+              self.$wx.checkJsApi({
+                jsApiList: ['chooseWXPay'],
+                success: (res) => {
+                  console.log('checked api:', res);
+                },
+                fail: (err) => {
+                  console.log('check api fail:', err);
+                },
+              });
+            });
+            self.$wx.error(function (res) {
+              console.log('err', res);
+            });
+          } else {
+            uni.showToast({
+              title: res.data.msg,
+              duration: 2000,
+              icon: 'none',
+            });
+          }
+        },
+      });
+    },
   },
 };
 </script>

src/store/index.js

@@ -60,6 +60,14 @@ const store = new Vuex.Store({
       uni.setStorageSync('openid', payload);
       state.openid = payload;
     },
+    SET_WX_ACCESS_TOKEN(state, payload) {
+      uni.setStorageSync('wxAccessToken', payload);
+      state.access_token = payload;
+    },
+    SET_WX_REFRESH_TOKEN(state, payload) {
+      uni.setStorageSync('wxRefreshToken', payload);
+      state.refresh_token = payload;
+    },
     SET_MEMBER(state, payload) {
       uni.setStorageSync('member', payload);
       state.member = payload;

src/utils/login.js

@@ -125,10 +125,36 @@ export function logout() {
  }>
  */
 export function WxJsOpenId(param) {
-  return request.get(
-    `https://qa-tparking.kerryplus.com/sns/oauth2/access_token`,
-    param
-  );
+  return request.get(`/sns/oauth2/access_token`, param);
+}
+// 微信公众号H5获取用户openId - 需要登录
+/*
+ 微信公众号H5获取 jsapi_ticket: 第一步
+ param: { code: string }
+
+ : Promise<{
+ code: string,
+ data: string
+ }>
+ */
+// access_token=ACCESS_TOKEN&type=jsapi
+export function WxJsGetTicket(param) {
+  return request.get(`/cgi-bin/ticket/getticket`, param);
+}
+
+// 微信公众号H5获取用户openId - 需要登录
+/*
+ 微信公众号H5获取 jsapi_ticket: 第一步
+ param: { code: string }
+
+ : Promise<{
+ code: string,
+ data: string
+ }>
+ */
+// access_token=ACCESS_TOKEN&type=jsapi
+export function WxJsGetTicket(param) {
+  return request.get(`/cgi-bin/ticket/getticket`, param);
 }
 
 // H5获取微信签名信息Api - 需要登录
@@ -159,12 +185,12 @@ function WxJsSdkSignature(param) {
 
  */
 export async function initWxJsSdkConfig(jsApiList = [], openTagList = []) {
-  let url = `${location.origin}`;
+  let url = location.href;
   // https://developers.weixin.qq.com/community/develop/doc/000ae2cb950808f90d8bc415551800
   if (getMobileOperatingSystem() === 'iOS' && window.H5_LAUNCH_URL) {
     url = window.H5_LAUNCH_URL;
   }
-  url = url.replace(/http(s)?:\/\//g, '');
+  // url = url.replace(/http(s)?:\/\//g, '');
   window.wxJsSdkConfigInitPromise = null;
   window.wxJsSdkConfigInitPromise = await WxJsSdkConfig(
     jsApiList,