プロジェクトのシナリオ:
実際のプロジェクトでは、ユーザーは印刷されたレシートの QR コードをスキャンすることで請求書発行機能を実現し、レシートの QR コードをスキャンした後、アプレットにジャンプして請求情報を追加し、送信する必要があります。請求書を発行するバックエンドのページ。
ソリューション
まず、QRコードの本質はリンクアドレスです。
次に、WeChat ミニ プログラム オープン プラットフォームにログインし、共通リンクの QR コードをスキャンしてミニ プログラムを開くように設定します。
最後に、ビジネス コードは QR コード リンクのパラメータを処理し、ターゲット ページは QR コード リンク アドレスのパラメータを受け取ります。
実際の操作:
1. WeChat オープン プラットフォームにログインし、[開発管理] > [開発設定] を見つけて、共通リンクの QR コードをスキャンしてミニ プログラムを開きます。
以下に示すように、プルダウンして設定エントリを見つけます。
要件に応じて設定でき、わからない人にはプロンプトとガイダンスが表示されます。
QR コード アドレス: カスタム リンク アドレスですが、ドメイン名は検査ファイルに合格する必要があります。
ミニ プログラム パス: リンクによってリダイレクトされるターゲット ページのパス。
テスト範囲: 自分のニーズに応じて選択できます。オンライン版はオンライン版である必要があります。
ここで、パラメータを渡す方法を尋ねるかもしれません。QR コードのパスを区別するためのプレフィックスが必要なだけです。下の図に私のテスト リンク アドレスが表示されます。get リクエストに従ってパラメータを渡します。
2. ターゲット ページはパラメータを受け取ります。ここでのターゲット ページは、pages/index/add です。
まずQRコードの元のリンクアドレスqrUrlを取得します。
ここでは、ページの onLoad メソッドでそれを取得します。
onLoad: function(e) {
// e={"q":"https://sp.tbzh.com/index?orderId=1&sfJyToken=false"};
//Common.isExist() 方法是我自己内部判断非空的
if(e.q&&Common.isExist(e.q)&&e.q!="undefined"){//扫码进入
const qrUrl = decodeURIComponent(e.q) // 获取到二维码原始链接内容
//GetWxMiniProgramUrlParam() 这个方法是解析链接地址中的参数方法
e = GetWxMiniProgramUrlParam(qrUrl);//此处就是我们要获取的参数 json
//比如我要得到orderId的值,直接取值即可
let orderId = e.orderId;
console.log("订单ID:"+orderId);
}
}
リンクアドレスパラメータの解析方法
GetWxMiniProgramUrlParam メソッドのコードは次のとおりです。
function GetWxMiniProgramUrlParam (url) {
let theRequest = {};
if(url.indexOf("#") != -1){
const str=url.split("#")[1];
const strs=str.split("&");
for (let i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
}
}else if(url.indexOf("?") != -1){
const str=url.split("?")[1];
const strs=str.split("&");
for (let i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
}
}
return theRequest;
}
3. この時点で、WeChat アプレット全体の共通リンクの QR コードをスキャンしてアプレット内のページを開くロジックが実現されました。
最後に書かれています: コードワードは簡単ではありませんが、少しでもお役に立てれば、気に入って収集していただければ幸いです。質問や修正がある場合は、コメント欄にメッセージを残してください~~~