QR kód
QQ WeChat Alipay 3-v-1 online generování
- Přizpůsobit barvu platebního kódu
- Zjednodušení QR kódů
Webová stránka ukázky:http://qr.no0a.cn
Adresa GitHubu:https://github.com/BWmelon/qrcode
předmluva
Nejprve jsem narazil na platební kód 3-v-1 byl sesame collection, který byl zpočátku zdarma, a pak se cena po vygenerování změnila na 5 RMB. Poté jsem použil dva systémy generování platebních kódů, jeden je inkasní a druhý je Youqimeng inkasní kód, první je velmi pohodlný, tedy rozpoznávání QR kódů je relativně pomalé, chci změnit rozhraní, ale nenaučil jsem se php a nemohu nic dělat. Ten druhý je zdrojový kód, který jsem si koupil, a chvíli mi trvalo, než jsem přiměl tu malou snachu, která mě požádala, abych tě zabanoval~( ̄▽ ̄)*, a když jsem našel autora, byl jsem před časem vyzván koupit zdrojový kód... Chtěl jsem jeho omezení zrušit, ale po přečtení tutoriálu html+css jsem byl bezmocný, takže jsem přišel s nápadem postavit si vlastní generační systém.
Strávil jsem několik týdnů tím, že jsem to dělal tam a zpět, v podstatě jsem to strávil čtením dokumentů o Baidu, protože jsem se to právě dozvěděl a nikdy jsem se s mnoha věcmi nesetkal. Po analýze funkcí tohoto systému mám pocit, že toho lze dosáhnout pomocí html+css+js, a poté Baidu začal postupně implementovat požadavky.
Princip
Po analýze bylo zjištěno, že jsou potřeba pouze dvě stránky.
- Generování stránek
Toto je hlavní stránka webu se dvěma funkcemi: jedna je nahrávat platební kódy QQ, WeChat a Alipay a dělit je do odkazů, a druhou je kombinovat tyto odkazy a generovat kombinovaný QR kód. Plugin 'qrcode' v jQuery se používá pro parsování a generování, zatímco pro estetiku se používá 'canvas' k vykreslení stylu platebního kódu.
- Platební stránka
Když mobilní zařízení naskenuje dříve vygenerovaný platební kód, tato stránka se otevře a získá tři parametry (qq, WeChat, odkaz na Alipay) zadané v platebním kódu, a poté vyhodnotí QR kód naskenovaný aktuálním softwarem podle prohlížeče. UA, qq a WeChat nemohou přímo vyvolat platbu, poté se zobrazí rozhraní QR kódu, aby uživatelé mohli dlouhým stiskem zaplatit, Alipay může přímo vstoupit do stránky převodu.
V tomto případě je tento web připravený, generovaná stránka si půjčuje z kolekce a platebního kódu Youqimeng, aby to nebylo monotónní a nekopírovalo jejich funkce ztuhle, po chvíli přemýšlení jsem si pořídil funkci změny barvy (připadá mi to zbytečné, je to celé složené z obsahu haha), pokud potřebujete jiné styly, můžete jít na jejich web a vygenerovat. A protože tři odkazy na platební kód jsou dohromady obzvlášť dlouhé, generovaný QR kód je hustší (tedy ošklivý) a dlouhá URL je zkrácena přes suo.im, takže generovaný QR kód je jednodušší.
používat
1. Stáhněte zdrojový kód a nahrajte ho na svůj vlastní server nebo webhosting.
2. Změňte kód na červené obálce Alipay a heslo na červené obálce v '/js/index.js' a smažte příslušný kód, pokud není potřeba generovat rozhraní pro reklamy na červené obálce, které jsou v souboru označeny.
Pokud narazíte na nějaké problémy, prosím, dejte zpětnou vazbu, i když je možná nebudu schopen vyřešit
Dík
* Vyzvedni si peníze
* Youqimeng platební kód
* Layui
|
Zveřejněno 20.01.2019 9:47:23
|
|
|
Zveřejněno 01.11.2019 11:41:54