安裝和使用

npm install weixin-jsapi import wx from 'weixin-jsapi'

封裝成一個方法

import wx from "weixin-jsapi" // 獲取簽名的接口(wx.config 里面的幾個參數) import { handleWxScanCode } from "@/api/tools" /*** 喚起微信支付* 獲取微信簽名信息* url: 當前掃碼界面的url*/ const wxScanCode = (url) => {return new Promise(async(resolve,reject) => {let result = ''// const url = window.location.href.split("#")[0]// 發送請求const res = await handleWxScanCode({ url })const { timestamp, nonceStr, signature, appId } = res.datawx.config({debug: false, // 調試模式，true 開啟， false 關閉appId: appId, // 必填，公眾號的唯一標識timestamp: timestamp, // 必填，生成簽名的時間戳nonceStr: noncestr, // 必填，生成簽名的隨機串signature: signature, // 必填，簽名jsApiList: ["scanQRCode"], // 必填，需要使用的JS接口列表})wx.error(function(res) {})wx.ready(function() {wx.checkJsApi({jsApiList: ["scanQRCode"],success: function(res) {}})wx.scanQRCode({needResult: 1, // 默認為0，掃描結果由微信處理，1則直接返回掃描結果，scanType: ["qrCode", "barCode"], // 可以指定掃二維碼還是一維碼，默認二者都有success: function(res) {// 業務代碼，根據自己的實際需求來編寫// resultStr： 掃碼成功后返回的結果result = res.resultStrresult = result.split('?')[1].split('=')[1]// 獲取到自己需要的結果resolve(result)}})})}) } export default wxScanCode

總結

以上是生活随笔為你收集整理的h5唤起微信扫一扫的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。