jQuery implementiert die WeChat-Funktion zur Erkennung von QR-Codes durch langes Drücken

Ich habe kürzlich an einem WeChat-Entwicklungsprojekt gearbeitet und es ist endlich fast abgeschlossen. Heute habe ich mir etwas Zeit genommen, um die Lösung für das Problem aufzuzeichnen, dass der von jquery.qrcode.min.js generierte QR-Code nicht erkannt wurde Lange während des Projektentwicklungsprozesses gedrückt, hoffe, es hilft allen!

1. JS-Bibliothek vorstellen

<script src="jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.qrcode.min.js" type="text/javascript" charset="utf-8"></script>

2. Ein leeres Div auf der Seite erstellen; >3. QR-Code generieren

<div id="qrDiv"></div>

Hinweis: Der zu diesem Zeitpunkt generierte QR-Code hat in Changan in WeChat keine Antwort, da qrcode Canvas-Tags anstelle von IMG-Tags generiert

$("#qrDiv").qrcode({
width: 120, //宽度
height:120, //高度
text: "需要生成的二维码内容" //任意内容
});

4. Canvas-Tag in IMG-Tag umwandeln

Hinweis: Nachdem Sie die oben genannten Schritte ausgeführt haben, können Sie lange drücken, um es in WeChat zu identifizieren

//从 canvas 提取图片 image
function convertCanvasToImage(canvas) {
//新Image对象，可以理解为DOM
var image = new Image();
// canvas.toDataURL 返回的是一串Base64编码的URL，当然,浏览器自己肯定支持
// 指定格式 PNG
image.src = canvas.toDataURL("image/png");
return image;
}
//获取网页中的canvas对象
var mycanvas1=document.getElementsByTagName('canvas')[0];
//将转换后的img标签插入到html中
var img=convertCanvasToImage(mycanvas1);
$('#imagQrDiv').append(img);//imagQrDiv表示你要插入的容器id

Das Oben ist die vom Herausgeber eingeführte jQuery-Implementierung der WeChat-QR-Code-Funktion. Ich hoffe, sie wird Ihnen hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Herausgeber wird Ihnen rechtzeitig antworten. Ich möchte mich auch bei Ihnen allen für Ihre Unterstützung der chinesischen PHP-Website bedanken!

Weitere Artikel zur jQuery-Implementierung der WeChat-QR-Code-Funktion zur Erkennung von langem Drücken finden Sie auf der chinesischen PHP-Website!