I. Einleitung
Programmierer generieren häufig QR-Codes in Anwendungen wie Web, Apps und Applets. Es gibt viele Möglichkeiten, QR-Codes zu generieren. Wenn Sie neu darin sind: Die im Internet gefundenen Codes werden grundsätzlich von lokalen Programmen generiert. Tatsächlich ist dies der Fall Am problematischsten ist, dass es einen besseren Weg gibt, nämlich die Online-Schnittstelle zu nutzen, die einfach, bequem und schnell ist.
2. Online-Schnittstelle
Hier empfehlen wir die Tencent-eigene Schnittstelle, die über einen langen Zeitraum stabil und zuverlässig ist, andere nicht große Hersteller sind nicht zu empfehlen
Schnittstelle 1
https://minico.qq.com/qrcode/get?type=2&r=1&size=300&b=miniapp&text=https://www.qq.com
- text ist die URL
- Größe Größe
- Typ ist unbekannt, muss und kann nur 2 ausfüllen
- b Unbekannt, nicht erforderlich, in der Mitte der Miniapp wird ein kleines Logo angezeigt
- R-Stil, 1 ist quadratisch, 2 ist rund
Schnittstelle 2
https://qun.qq.com/qrcode/index?data=https://www.qq.com&size=300
- Daten-URL
- Größe
Diese feste Größe hat einen weißen Rand
3. Online-Website
Es gibt viele Online-Websites. Der beliebteste QR-Code https://cli.im/url
bietet den Vorteil leistungsstarker Funktionen. Er generiert nicht nur URLs, sondern unterstützt auch Text, Video, Bilder und Stapel. Allerdings gibt es ist kein Schnittstellenaufruf und kann nur generiert und eingefügt werden. Kommen Sie und nutzen Sie es.
4. Lokales Programm
Der Vorteil des lokalen Programms besteht darin, dass es stabil und kontrollierbar ist. Der Nachteil besteht jedoch darin, dass es die Bibliothek importieren und den Code manuell zerreißen muss.
Derzeit gibt es auch viele Plug-Ins und Codes, die kopiert werden können. Verschiedene Sprachen haben unterschiedliche Methoden. Hier ist eine Demonstration von vue3 + qrcodejs2:
- Installieren Sie
npm install qrcodejs2 --save - verwenden
<template>
<div id="qrcode" ref="qrcodeRef"></div>
</template>
<script lang="ts" setup>
import {
onMounted, ref } from 'vue'
import QRCode from 'qrcodejs2' // 引入插件
const qrcodeRef = ref()
const initQrcode = () => {
qrcodeRef.value.innerHTML = '' // 这里可以每次调用时清除，根据实际情况来使用
if (state.qrCode) return
state.qrCode = new QRCode(qrcodeRef.value, {
text: 'https://blog.csdn.net/', // 网址
width: 200, // 宽
height: 200, // 高
colorDark: '#000000', // 主颜色
colorLight: '#ffffff', // 背景色
})
}
onMounted(() => {
initQrcode()
})
</script>
如果帮到您，点个赞再走~