QRcode
QQ WeChat Alipay generație online 3-în-1
- Personalizarea culorii codului de plată
- Simplificarea codului QR
Site demonstrativ:http://qr.no0a.cn
Adresă GitHub:https://github.com/BWmelon/qrcode
prefață
La început, am intrat în contact cu codul de plată 3-în-1 era colecția de susan, care la început era gratuită, iar apoi prețul a devenit 5RMB odată generat. După aceea, am folosit două sisteme de generare a codurilor de plată, unul este colectarea, iar celălalt este codul de colectare Youqimeng, primul este foarte convenabil de folosit, adică recunoașterea codurilor QR este relativ lentă, vreau să schimb interfața, dar nu am învățat PHP și nu pot face nimic. Ultimul este codul sursă pe care l-am cumpărat și a durat ceva până când micuța noră mi-a cerut să te interzic ( ̄▽ ̄)~*, iar după ce am găsit autorul, am fost îndemnat să cumpăr codul sursă acum ceva timp... Am vrut să-i anulez restricțiile, dar am fost neputincios după ce am citit tutorialul html+css, așa că mi-a venit ideea de a-mi construi propriul sistem de generare.
Am petrecut câteva săptămâni făcând asta înainte și înapoi, practic petrecându-le citind documente despre Baidu, pentru că abia aflasem asta și nu fusesem expus la multe lucruri. După ce am analizat funcțiile acestui sistem, simt că acest lucru poate fi realizat prin html+css+js, iar apoi Baidu a început să implementeze cerințele pas cu pas.
Principiu
După analiză, s-a constatat că erau necesare doar două pagini.
- Generarea paginilor
Aceasta este pagina principală a site-ului, cu două funcții: una este încărcarea codurilor de plată QQ, WeChat, Alipay și analizarea lor în linkuri, iar cealaltă este combinarea acestor linkuri și apoi generarea codului QR combinat. Pluginul 'qrcode' al jQuery este folosit pentru analizare și generare, iar pentru estetică, 'canvas' este folosit pentru a desena stilul codului de plată.
- Pagina de plăți
Când dispozitivul mobil scanează codul de plată generat anterior, această pagină este deschisă și va primi cei trei parametri (qq, WeChat, Link Alipay) trimiși în codul de plată, iar apoi va evalua că codul QR scanat de software-ul curent conform browserului UA, qq și WeChat nu poate invoca direct plata, iar interfața codului QR este afișată pentru utilizatori pe care să o apese pentru a plăti, iar Alipay poate intra direct pagina de transfer.
În acest caz, acest site este gata, pagina generată împrumută din colecție și codul de plată Youqimeng, ca să nu fie monoton și să nu copieze funcțiile lor rigid, după ce m-am gândit o vreme, am primit o funcție de schimbare a culorii (pare inutilă, e complet compusă din conținut haha), dacă ai nevoie de alte stiluri, poți merge pe site-ul lor să generezi. Și pentru că cele trei linkuri de coduri de plată se adună pentru a fi deosebit de lungi, codul QR generat este mai dens (adică urât), iar URL-ul lung este scurtat prin suo.im, astfel încât codul QR generat să fie mai simplu.
folosi
1. Descarcă codul sursă și încarcă-l pe propriul server sau gazdă web.
2. Schimbați codul plicului roșu Alipay și parola plicului roșu în '/js/index.js' și ștergeți codul relevant dacă nu este nevoie să generați o interfață pentru reclamele plicurilor roșii, care au fost marcate în fișier.
Dacă întâmpini probleme, te rog să dai feedback, deși s-ar putea să nu pot să le rezolv
Mulţumesc
* Colectează-ți banii
* Cod de plată Youqimeng
* Layui
|
Postat pe 20.01.2019 09:47:23
|
|
|
Postat pe 01.11.2019 11:41:54