QRcode
QQ WeChat Alipay 3-in-1 çevrimiçi nesil
- Ödeme kodu rengini özelleştirin
- QR kod basitleştirme
Demo web sitesi:http://qr.no0a.cn
GitHub adresi:https://github.com/BWmelon/qrcode
önsöz
İlk başta, 3-in-1 susam toplama ödeme koduyla tanıştım, başta ücretsizdi, sonra fiyat oluşturulduktan sonra 5RMB oldu. Bundan sonra iki ödeme kodu oluşturma sistemi kullandım, biri tahsilat, diğeri Youqimeng tahsilat kodu, ilki kullanımı çok kolay, yani QR kod tanıma nispeten yavaş, arayüzü değiştirmek istiyorum ama php öğrenmedim ve hiçbir şey yapamıyorum. İkincisi benim aldığım kaynak kodu ve küçük gelinin bana seni banlamamı ( ̄▽ ̄) istemesi biraz zaman aldı~*, yazarı bulduktan sonra bir süre önce kaynak kodunu almam istendi... Kısıtlamalarını kaldırmak istedim ama html+css eğitimini okuduktan sonra çaresizdim, bu yüzden kendi üretim sistemimi kurma fikrini aklıma geldim.
Birkaç hafta boyunca bunu karşılıklı olarak yaptım, temelde Baidu'daki belgeleri okurken geçirdim, çünkü bunu yeni öğrenmiştim ve çok fazla şeye maruz kalmamıştım. Bu sistemin fonksiyonlarını analiz ettikten sonra, bunun html+css+js ile yapılabileceğini düşünüyorum ve ardından Baidu gereksinimleri adım adım uygulamaya başladı.
İlke
Analizden sonra sadece iki sayfa gerektiği tespit edildi.
- Sayfa oluşturma
Burası web sitesinin ana sayfasıdır ve iki işlevi vardır: biri QQ, WeChat, Alipay ödeme kodlarını yükleyip bağlantılara ayırmak, diğeri ise bu bağlantıları birleştirip birleşik QR kodunu oluşturmak. jQuery'nin 'qrcode' eklentisi ayrıştırma ve oluşturma için kullanılırken, estetik için ödeme kodunun tarzını çizmek için 'canvas' kullanılır.
- Ödeme sayfası
Mobil cihaz önceden oluşturulan ödeme kodunu taradığında, bu sayfa açılır ve ödeme kodunda geçen üç parametreyi (qq, WeChat, Alipay bağlantısı) alır, ardından mevcut yazılım tarafından taranan QR kodu tarayıcıya göre değerlendirilir; UA, qq ve WeChat doğrudan ödeme başlatamaz, ardından QR kod arayüzü görüntülenir ve kullanıcılar uzun basarak ödeme yapabilir, Alipay doğrudan transfer sayfasına girebilir.
Bu durumda, bu web sitesi hazır, oluşturulan sayfa koleksiyondan ve Youqimeng ödeme kodundan ödünç alıyor, monoton olmaması ve işlevlerini sert kopyalamaması için, bir süre düşündükten sonra renk değiştirme fonksiyonu aldım (işe yaramaz hissettiriyor, tamamen içerikten oluşuyor haha), başka stillere ihtiyacınız olursa, web sitesine gidip üretebilirsiniz. Ve üç ödeme kodu bağlantısı toplamda özellikle uzun olduğundan, oluşturulan QR kodu daha yoğun (yani çirkin) ve uzun URL suo.im boyunca kısaltılır, böylece oluşturulan QR kodu daha basit olur.
kullanmak
1. Kaynak kodunu indirip kendi sunucunuza veya web barındırıcınıza yükleyin.
2. Alipay kırmızı zarf kodunuzu ve kırmızı zarf şifrenizi '/js/index.js' içinde değiştirin ve dosyada işaretlenmiş kırmızı zarf reklamları için arayüz oluşturmanız gerekmiyorsa ilgili kodu silin.
Herhangi bir sorunla karşılaşırsanız lütfen geri bildirim verin, ancak çözemeyebilirim
Teşekkürler
* Paranızı topla
* Youqimeng ödeme kodu
* Layui
|
Yayınlandı 20.01.2019 09:47:23
|
|
|
Yayınlandı 1.11.2019 11:41:54