VPS参考测评推荐
专注分享VPS主机优惠信息
hostkvm优惠促销活动
zji优惠促销活动
衡天云优惠活动
亚马逊云aws.amazon.com最新优惠活动
华纳云最新优惠促销活动

自定义微信登录扫码样式解决方案(微信扫码注册怎么做)

locvps
主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情!
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作

最近需要做一个PC端的微信扫码登录。微信扫码有两种方式,一是打开新的二维码页面,二是嵌入商品页面。以嵌入式二维码为例。如何在页面中显示一个登录二维码,文档中已经很清楚了,这里就不赘述了。

解决自定义微信二维码样式的问题。一切就绪后,网页上的二维码默认是这样的。自定义微信登录扫码样式解决方案(微信扫码注册怎么做)特别大(默认二维码大小280x280),微信登录的标题。下面还有扫码登录的提示。好在微信留了个api给我们自定义风格的机会。当实例化一个二维码之前,实例对象中的href属性允许设置样式。

var obj = new WxLogin({ id: ;登录容器 ,appid: ;",范围: ",redirect _ uri: ;",状态: ",风格: ",href: ;../QR code . CSS ;//就是这个属性});不幸的是,当样式文件的地址被传递到href中时,将会报告一个错误。似乎微信只是出于安全考虑才允许访问https资源。所以现在采用了第二种方案,data-url。

通过访问data-url解决风格问题。写一个nodejs,脚本会把刚才的css资源转换成data-url。具体代码实现如下:

var fs = require( # 39;fs # 39);//将文件数据编码为base64编码字符串的函数function base64 _ encode(file){//read binary data var bitmap = fs . read file sync(file);//将二进制数据转换为base64编码的字符串return # 39数据:text/CSS;base64, # 39;+新缓冲区(位图)。toString( # 39;base64 # 39);} console . log(base64 _ encode( # 39;。/QR code . CSS # 39;))运行节点脚本,复制打印出来的data-url,然后赋给刚才的href。自定义微信登录扫码样式解决方案(微信扫码注册怎么做)

var obj = new WxLogin({ id: ;登录容器 ,appid: ;",范围: ",redirect _ uri: ;",状态: ",风格: ",href: ;数据:text/CSS;base64,lmltcg 93 zxjcb 3 gglnfyy 29 kzsb 7d 2 lkdgg 6 idiwmhb 4 o 30 NCI 5 PBB xbv D2 vyqm 94 IC 50 axrszsb 7 zglzcgxhetogbm 9 uztt 9 dquoaw 5 mby 7d 2 lkdgg 6 idiwmhb 4 o 30 NCI 5 zdgf 0 dxnfawnvbib 7 zglzzzgxhetpub 25 lf Q0 klmltcg 93 zjcb 3 ggl nn 0 yx R1 cyb 7dg//data -URL });注意这里的MIME类型,一定要返回text/css。自定义二维码:自定义微信登录扫码样式解决方案(微信扫码注册怎么做)

相关教程:

微信登录的一些新收获

二维码php的制作和下载方法

生成javascript二维码的两种方法

这就是自定义微信登录扫码样式的解决方案的细节。请多关注主机参考其他相关文章!

这几篇文章你可能也喜欢:

  • 暂无相关推荐文章

本文由主机参考刊发,转载请注明:自定义微信登录扫码样式解决方案(微信扫码注册怎么做) https://zhujicankao.com/81178.html

【腾讯云】爆款2核2G云服务器首年40元,企业首购最高获赠300元京东卡
打赏
转载请注明原文链接:主机参考 » 自定义微信登录扫码样式解决方案(微信扫码注册怎么做)
主机参考仅做资料收集,不对商家任何信息及交易做信用担保,购买前请注意风险,有交易纠纷请自行解决!请查阅:特别声明

评论 抢沙发

评论前必须登录!