微信小程序中使用 token 验证及解决error code”:40029, invalid code

Bertha 。 2023-03-06 05:50 2阅读 0赞

#### 1.首先获取 token ####

###### 这里需要服务端的配合，要么自己写一个，要么找一个，在需要使用 token 验证的界面 ######

onGetToken() { 
        wx.login({ 
          success: (res) => { 
            if (res.code) { 
              wx.request({ 
              // 获取 token 地址
                url: 'http://localhost:3000/v1/token',
                method: 'POST',
                // data 是服务端 返回 token 需要的参数，根据自己情况而定
                data: { 
                  account: res.code,
                  type: 100
                },
                success: (res) => { 
                  console.log(res)
                  const code = res.statusCode.toString()
                  if (code.startsWith('2')) { 
                  // 保存 token 到本地
                    wx.setStorageSync('token', res.data.token)
                  }
                }
              })
            }
          }
        })
      },

###### 当需要使用 token 的时候 ######

onGetClassic() { 
        wx.request({ 
          url: 'http://localhost:3000/v1/classic/latest',
          header: { 
            Authorization: this._encode()
          },
          success: (res) => { 
            console.log(res.data)
          }
        })
      },
     _encode() { 
        const token = wx.getStorageSync('token')
        const base64 = Base64.encode(token + ':')
        return "Basic " + base64
      },

###### 这里需要使用 js-base64 ，所以我们需要在最开始的时候，引入 js-base64 ######

import {  Base64 } from 'js-base64'

#### 在 微信小程序中使用 npm 方法 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 1]

###### 在根目录打开 `npm init -y` ######

###### `npm i js-base64` ######

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 2]

###### 即可在小程序中使用了。 ######

###### 特此说明：在确保服务端无错的情况下，如果 微信返回的报错是 code 无效的话，error code”:40029, invalid code，可能的一种原因就是你使用的 appid 是测试号，这是行不通的，要使用正确的 APPID 才可以访问成功。 ######

关注公众号：大明贵妇，无套路获取前端学习资料，期待各位客官来临  
![在这里插入图片描述][20201130112242201.jpg_pic_center]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center]: /images/20230208/d5102b9d85ff4b5c95310f3b7aa06b1b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20230208/59f4e60ed10b4659ae5e7ccd0f7ecb99.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20230208/6acf798af63d419c99075ad1d365ee91.png
[20201130112242201.jpg_pic_center]: /images/20230208/23ceeb38b57d435ab80f705bbce5a352.png