修改微信扫码登录,二维码样式

  1. 开工后的第一篇博客,记得在去年给自己定的计划是每月一篇博客,看来有点没有持之以恒,抱歉…,进入正题:

  2. 过完年来一直在赶项目进度,期间也遇到很多问题,很想把它分享出来,时间问题吧,没有及时写出来,今天遇到在解决项目中扫码登录的几个问题时,看到网上资源很少,我来贡献一份吧!

    2.1.问题:
    二维码太大,跟项目中密码登录模块不协调,产品跟业务不太满意,自己也看得不舒服,下面是改小过的
    这里写图片描述

    2.2.问题:
    不想显示网站应用名称:以上红框分别是微信官方自带的提示跟网站应用名称,

  3. 解决办法:
    讲半天都是样式问题而已,作为前端来讲,css隐藏一个东西so easy啊,但是像这种iframe进来的完全不起作用,目前解决办法应该只有两个可以解决这个样式问题
    3.1:style默认是black,或者是white,填其他样式没有用,href属性,微信官方提供的一个安全链接,意思就是要用https,项目中接口都是http,去哪写个css文件放到一个公用的安全链接上,尼玛,太浪费了,此方法不合适
    这里写图片描述
    3.2:node出场,既然在项目中引用到了,怎么玩你就是我的事,说把你变小就变小,说把你去掉就去掉
    项目是使用dev,在webpackrc中本来就用到了node的模块,现在只是加个fs模块,如下图
    这里写图片描述
    QRcode.css是修改二维码的样式,想怎么改,就怎么写,满意就好,运行一下这段脚本,会在终端console出来一个data-url出来,讲这段字符串放到href中,热加载以后,样式里面改变。
    这里写图片描述
    从data开始,整个放到href中,
    node水平太差,后期还要补习一下,总体使用了node的fs模块中的readFileSync方法,生成一个base64的data-url

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值