feat(全局): 新需求项目转化为h5环境下运行

具备请求后台能力login getinfo跑通

api/login.js

 import request from '@/utils/request'
+import Qs from 'qs'
+import {encrypt} from "../utils/jsencrypt";
 
 // 微信登录方式(宠物主)
 export function wxLogin(code) {
@@ -30,20 +32,21 @@ export function login(username, password, code, uuid) {
     code,
     uuid
   }
+  console.log('加密前数据', data)
   return request({
-    'url': '/login',
-    headers: {
-      isToken: false
-    },
-    'method': 'post',
-    'data': data
+    url: '/auth/login',
+    method: 'post',
+    data: Qs.stringify({
+      sign: encrypt(data)
+    }),
+    headers: {}
   })
 }
 
 // 获取用户详细信息
 export function getInfo() {
   return request({
-    'url': '/getInfo',
+    'url': '/system/user/getInfo',
     'method': 'get'
   })
 }
@@ -59,7 +62,7 @@ export function logout() {
 // 获取验证码
 export function getCodeImg() {
   return request({
-    'url': '/captchaImage',
+    'url': '/captcha/captchaImage',
     headers: {
       isToken: false
     },

package.json

@@ -13,5 +13,9 @@
     "babel-eslint": "10.1.0",
     "eslint": "7.15.0",
     "eslint-plugin-vue": "7.2.0"
+  },
+  "dependencies": {
+    "jsencrypt": "^3.0.0-rc.1",
+    "qs": "^6.14.0"
   }
 }

pages/login.vue

@@ -9,10 +9,27 @@
         :src="defaultLogo"
       />
     </view>
+    <view class="login-form-content">
+      <view class="input-item flex align-center">
+        <view class="iconfont icon-user icon"></view>
+        <input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
+      </view>
+      <view class="input-item flex align-center">
+        <view class="iconfont icon-password icon"></view>
+        <input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
+      </view>
+      <view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
+        <view class="iconfont icon-code icon"></view>
+        <input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
+        <view class="login-code">
+          <image :src="codeUrl" @click="getCode" class="login-code-img"></image>
+        </view>
+      </view>
+    </view>
     <!--  下方微信授权登录  -->
     <view class="action-btn">
       <!--  协议勾选后获取手机号  -->
-      <button class="now-style" open-type="getPhoneNumber" @getphonenumber="goIndexTemp($event)">
+      <button class="now-style" open-type="getPhoneNumber" @click="handleLogin()">
         <text>点击登录</text>
       </button>
     </view>
@@ -32,12 +49,12 @@ export default {
     return {
       codeUrl: '',
       loading: false,
-      captchaEnabled: true,
+      captchaEnabled: false,
       globalConfig: getApp().globalData.config,
       loginForm: {
         username: 'admin',
-        password: 'admin123',
-        code: '',
+        password: '123456',
+        code: undefined,
         uuid: ''
       },
       // 登录勾选协议--默认不勾选
@@ -54,17 +71,17 @@ export default {
     }
   },
   created() {
-    // this.getCode()
+    this.getCode()
     // this.getLogo()
   },
   onLoad() {
     console.log('微信登陆页面')
-    this.getWxCode()
+    /*this.getWxCode()
     this.$store.commit('SET_SHOW_CONFIRM', true)
     this.$store.commit('SET_LOGOUT_BTN', false)
     setInterval(() => {
       this.getWxCode()
-    }, 5 * 59 * 1000) // 5分钟的毫秒数
+    }, 5 * 59 * 1000) // 5分钟的毫秒数*/
   },
   methods: {
     // 获取微信code码
@@ -155,7 +172,8 @@ export default {
     },
     // todo 跳转首页 暂时使用
     goIndexTemp() {
-      const token = 'eyJhbGciOiJIUzI1NiJ9.eyJwaG9uZSI6bnVsbCwiZXhwIjoxNzQwOTg1Njg0LCJzdWIiOiJhZG1pbiIsImlhdCI6MTc0MDM4MDg4NCwid3hOaWNrbmFtZSI6bnVsbCwidXNlcm5hbWUiOiJhZG1pbiIsInVzZXJuYW1lOmFkbWluIjp7ImJ1c2luZXNzSWQiOiIxIiwidXNlcm5hbWUiOiJhZG1pbiIsInBhc3N3b3JkIjoiJDJhJDEwJG5zUEtLZklKRXpNbmlaS2M5WGFjZ09KczB1Tlp0ellhUGZBdTAxZXZsb2MvWDR3bDNpNDEuIiwiZGVwdElkIjoiNDAxIiwiZGVwdE5hbWUiOiLkuJzpo47mnKznlLDlj5HliqjmnLrmnInpmZDlhazlj7giLCJwaG9uZSI6bnVsbCwid3hOaWNrTmFtZSI6bnVsbCwicm9sZUlkcyI6IiIsInN0YWZmTGV2ZWwiOiIxIiwicHJvZHVjdGl2ZVJvbGVJZHMiOiIiLCJub25Qcm9kdWN0aXZlUm9sZUlkcyI6IiIsImlkbU5hbWUiOiLnrqHnkIblkZgiLCJub3RMb2NrZWQiOnRydWUsImF1dGhvcml0aWVzIjpudWxsLCJlbmFibGVkIjp0cnVlLCJhY2NvdW50Tm9uRXhwaXJlZCI6dHJ1ZSwiYWNjb3VudE5vbkxvY2tlZCI6dHJ1ZSwiY3JlZGVudGlhbHNOb25FeHBpcmVkIjp0cnVlfSwiYnVzaW5lc3NJZCI6IjEifQ.Ak9rM4W-ZqhUox4N4oc6AXOLyL2Z3gKlX1g3pQbx6hw'
+      console.log('goIndexTemp')
+      const token = 'eyJhbGciOiJIUzI1NiJ9.eyJwaG9uZSI6bnVsbCwiZXhwIjoxNzQyNDMzNzc5LCJzdWIiOiJhZG1pbiIsImlhdCI6MTc0MTgyODk3OSwid3hOaWNrbmFtZSI6bnVsbCwidXNlcm5hbWUiOiJhZG1pbiIsInVzZXJuYW1lOmFkbWluIjp7ImJ1c2luZXNzSWQiOiIxIiwidXNlcm5hbWUiOiJhZG1pbiIsInBhc3N3b3JkIjoiJDJhJDEwJG5zUEtLZklKRXpNbmlaS2M5WGFjZ09KczB1Tlp0ellhUGZBdTAxZXZsb2MvWDR3bDNpNDEuIiwiZGVwdElkIjoiNDAxIiwiZGVwdE5hbWUiOiLkuJzpo47mnKznlLDlj5HliqjmnLrmnInpmZDlhazlj7giLCJwaG9uZSI6bnVsbCwid3hOaWNrTmFtZSI6bnVsbCwicm9sZUlkcyI6IjIiLCJzdGFmZkxldmVsIjoiMSIsInByb2R1Y3RpdmVSb2xlSWRzIjoiMiIsIm5vblByb2R1Y3RpdmVSb2xlSWRzIjoiIiwiaWRtTmFtZSI6IueuoeeQhuWRmCIsIm5vdExvY2tlZCI6dHJ1ZSwiYXV0aG9yaXRpZXMiOm51bGwsImVuYWJsZWQiOnRydWUsImFjY291bnROb25FeHBpcmVkIjp0cnVlLCJhY2NvdW50Tm9uTG9ja2VkIjp0cnVlLCJjcmVkZW50aWFsc05vbkV4cGlyZWQiOnRydWV9LCJidXNpbmVzc0lkIjoiMSJ9.Pa5SApOWxgmWPc_N0wQFrqHh-CBnQlpBZO_cUFT3S1I'
       this.$store.dispatch('LoginPetOwner', token)
       this.$tab.reLaunch('/pages/index')
     },
@@ -186,11 +204,12 @@ export default {
     // 获取图形验证码
     getCode() {
       getCodeImg().then(res => {
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
+        this.loginForm.uuid = res.uuid
+        /*this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
         if (this.captchaEnabled) {
           this.codeUrl = 'data:image/gif;base64,' + res.img
           this.loginForm.uuid = res.uuid
-        }
+        }*/
       })
     },
     // 登录方法

pages/message/index.vue

@@ -100,7 +100,7 @@
         />
       </view>
       <view v-show="loadStatus === 'loading'" style="text-align: center">
-        <image src="../../static/images/home/loading.gif" style="width: 50rpx;height: 60rpx;" />
+        <!-- <image src="../../static/images/home/loading.gif" style="width: 50rpx;height: 60rpx;" /> -->
       </view>
 
       <!--顶部提示-->

store/modules/user.js

@@ -64,8 +64,8 @@ const user = {
       const uuid = userInfo.uuid
       return new Promise((resolve, reject) => {
         login(username, password, code, uuid).then(res => {
-          setToken(res.token)
-          commit('SET_TOKEN', res.token)
+          setToken(res.data)
+          commit('SET_TOKEN', res.data)
           resolve()
         }).catch(error => {
           reject(error)

utils/jsencrypt.js

+import JSEncrypt from 'jsencrypt/bin/jsencrypt'
+
+// 密钥对生成 http://web.chacuo.net/netrsakeypair
+
+const publicKey = 'MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAu6EsPHTuCzwyZ7D0/OhW\n' +
+  'QDQdB9tByC0vDnb7k7gmT0h77/mmJYcwvuqUdj+PXKO+V1NlJJqlf61UjcQkWD9o\n' +
+  'K6M1MHLHlS1qWXeXGaETClNUXAhdw2IkdBouXSHxyDkXYIDINYlOd91chxEBuBac\n' +
+  'igJI0c5p9BA62QcOKDUE2mDJL+LOd70NCYsJf3um1IAgfKDX8RH2H3aPxy/BJ8aS\n' +
+  'Edu+M9YDWsF6VFpaBr/WPPdouuPPjfs5203PCbvp0pvco+05JNDSiurEFcL+VDMm\n' +
+  'wFNKExmeCvn/zr+UIkRPWHwxfJq+/gw/lt+UzBO2NURhCv4pQZy19vdFLLLeMM09\n' +
+  'ewIDAQAB'
+
+export function encrypt(data) {
+  const json = JSON.stringify(data)
+  const encryptor = new JSEncrypt()
+  encryptor.setPublicKey(publicKey)
+  return encryptor.encrypt(json)
+}
+
+export function decrypt(txt) {
+  const encryptor = new JSEncrypt()
+  encryptor.setPrivateKey('')
+  return encryptor.decrypt(txt)
+}
+
+const passwordPublicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBANL378k3RiZHWx5AfJqdH9xRNBmD9wGD\n' +
+  '2iRe41HdTNF8RUhNnHit5NpMNtGL0NPTSSpPjjI1kJfVorRvaQerUgkCAwEAAQ=='
+
+const passwordPrivateKey = 'MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEA0vfvyTdGJkdbHkB8\n' +
+  'mp0f3FE0GYP3AYPaJF7jUd1M0XxFSE2ceK3k2kw20YvQ09NJKk+OMjWQl9WitG9p\n' +
+  'B6tSCQIDAQABAkA2SimBrWC2/wvauBuYqjCFwLvYiRYqZKThUS3MZlebXJiLB+Ue\n' +
+  '/gUifAAKIg1avttUZsHBHrop4qfJCwAI0+YRAiEA+W3NK/RaXtnRqmoUUkb59zsZ\n' +
+  'UBLpvZgQPfj1MhyHDz0CIQDYhsAhPJ3mgS64NbUZmGWuuNKp5coY2GIj/zYDMJp6\n' +
+  'vQIgUueLFXv/eZ1ekgz2Oi67MNCk5jeTF2BurZqNLR3MSmUCIFT3Q6uHMtsB9Eha\n' +
+  '4u7hS31tj1UWE+D+ADzp59MGnoftAiBeHT7gDMuqeJHPL4b+kC+gzV4FGTfhR9q3\n' +
+  'tTbklZkD2A=='
+
+// 加密
+export function passwordEncrypt(txt) {
+  const encryptor = new JSEncrypt()
+  encryptor.setPublicKey(passwordPublicKey) // 设置公钥
+  return encryptor.encrypt(txt) // 对需要加密的数据进行加密
+}
+
+// 解密
+export function passwordDecrypt(txt) {
+  const encryptor = new JSEncrypt()
+  encryptor.setPrivateKey(passwordPrivateKey)
+  return encryptor.decrypt(txt)
+}
+

utils/request.js

@@ -10,7 +10,12 @@ const baseUrl = config.baseUrl
 const request = config => {
   // 是否需要设置 token
   const isToken = (config.headers || {}).isToken === false
-  config.header = config.header || {}
+  config.header = config.header || {
+    'Content-Type': 'application/x-www-form-urlencoded'
+  }
+  console.log('getToken',getToken())
+  console.log('isToken',isToken)
+
   if (getToken() && !isToken) {
     config.header['Authorization'] = 'Bearer ' + getToken()
   }