自定义/修改微信二维码样式

最新推荐文章于 2023-12-04 15:45:34 发布
最新推荐文章于 2023-12-04 15:45:34 发布
阅读量1.8k 收藏 3
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42760581/article/details/103977083
版权
在项目中，通过微信二维码实现登录和注册功能时，发现微信二维码的样式无法直接用CSS修改。查阅微信开发者文档后，了解到可以自定义样式。通过在href属性中指定样式文件URL，但本地URL会报错。解决方案是使用Node.js脚本将本地URL转换为https的data URL，运行脚本获取正确的href值，然后应用到二维码样式中。
摘要由CSDN通过智能技术生成

在写项目的时候遇到的一个需求，登录和注册都可以通过扫描微信的二维码来实现，但是在做的时候发现微信有一些它自带的样式，并且无法通过CSS直接修改。

通过查微信的开发者文档发现是支持修改的

 wxHandle () {
   
      var obj = new WxLogin({
   
        id: "",
        appid: ,
        scope: "",
        redirec
最低0.47元/天 解锁文章
hello_kking
关注
js 生成二维码，自定义二维码样式
09-06
自动生成二维码，可设置二维码样式；自动生成二维码，可设置二维码样式；自动生成二维码，可设置二维码样式；自动生成二维码，可设置二维码样式；
微信二维码样式修改
月来better
03-29 1697
微信官方开发文档地址：https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html 当微信团队提供的默认样式与自己的页面样式不匹配，可以自己提供样式文件来覆盖默认样式。 如需修改以下样式： .impowerBox .qrcode {width: 200px;} .impowerBox .title {display: none;} .impowerBox .info {width: 200p
修改微信扫码登录，二维码样式
sinat_36193631的博客
03-17 1万+
开工后的第一篇博客，记得在去年给自己定的计划是每月一篇博客，看来有点没有持之以恒，抱歉…，进入正题： 过完年来一直在赶项目进度，期间也遇到很多问题，很想把它分享出来，时间问题吧，没有及时写出来，今天遇到在解决项目中扫码登录的几个问题时，看到网上资源很少，我来贡献一份吧! 2.1.问题： 二维码太大，跟项目中密码登录模块不协调，产品跟业务不太满意，自己也看得不舒服，下面是改小过的 2.2...
PC 微信扫码登录自定义二维码样式
weixin_68657031的博客
12-15 540
地址：https://tool.oschina.net/encrypt?type=3
微信扫码登录修改二维码的样式
最新发布
Hero_rong的博客
12-04 465
微信的了的 js 对象是这个样子，既然大家看到我这篇文章，想必里面的属性已经知道了，这里不做赘述。自定义二维码的样式关键属性在 href ，把想要添加的属性转成base64格式的就好了。我这里加的属性，是隐藏title，修改二维码的大小，如果有和我一样需求的就可以直接用了。默认是这个样子二维码都没有展示全。
Js 生成二维码图片和颜色可自行选择
Tongyao
06-09 1384
我们在平常开发过程中，难免遇到一些不依靠后端操作来实现的功能，例如，生成带图片的二维码，这篇文章讲述如何前端页面里引入js来生成二维码功能。 Js代码 引入组件 保存一份js文件，或直接在本js中引入......
google.zxing自定义生成微信二维码.rar
06-19
本项目是关于如何使用`google.zxing`库自定义生成微信二维码的实践，它允许我们将二维码与任意图片进行结合，创建出既实用又具有个性化的二维码图像。 `google.zxing`，又称ZXing（"zebra crossing"的缩写），是一...
vue 微信扫码登录(自定义样式)
11-28
在本文中，我们将深入探讨如何在Vue项目中实现微信扫码登录功能，并且重点介绍如何自定义样式。首先，我们需要安装`vue-wxlogin`插件，这是一个专为Vue.js设计的微信扫码登录组件。通过执行以下命令安装： ```bash ...
微信二维码自定义下方文字和各种样式
07-12
微信二维码自定义下方文字和样式，可以通过dome的思路，修改各种样式包括扫码成功的图标和样式
Vue+abp微信扫码登录的实现代码示例
11-29
最近系统中要使用微信扫码登录，根据微信官方文档和网络搜索相关文献实现了。分享给需要的人，也作为自己的一个笔记。后端系统是基于ABP的，所以部分代码直接使用了abp的接口，直接拷贝代码编译不通过。 注册微信开放平台账号# 在微信开放平台注册，注意是开放平台不是公众平台，这里需要300元，然后申请网站应用。审核通过后获取到AppID和AppSecret以及登记的网站url。只有此url下的地址微信扫码后才能回调。 具体申请条件见官方文档。 生成登录二维码# 在vue登录页面嵌入登录二维码，根据官方文档，在页面中放入一个div元素，二维码就放在此元素中，注意var obj = new WxLo
仿微信个人二维码切换样式
07-06
代码说明：http://blog.csdn.net/lidiwo/article/details/74554934
微信二维码
05-22
微信二维码是一种广泛应用于移动互联网时代的编码技术，它将各种信息（如网址、文本、名片、联系方式等）编码成一个黑白相间的图形，用户通过微信扫描即可快速获取或分享这些信息。在本文中，我们将深入探讨微信...
企业微信扫码登录后台管理系统，如何修改二维码样式
徐同保的专栏
04-22 1746
href字段为转码成base64格式的css文件 ，企业微信会把这个样式添加到iframe中 import { Base64 } from 'js-base64' new WwLogin({ id: 'm-wx-qrcode', appid: appId, agentid: agentId, redirect_uri: encodeURIComponent(redirectUri), state: 'w
Vue 内嵌微信登录二维码及修改默认样式
takeki_的博客
04-26 4169
1. index.html 引入微信官方提供的js文件 <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script> 2.需要内嵌二维码的页面中 // template 代码 <div id="wxcode"> </div> // methods 代码 createWxQrcode() {
微信开放平台网页扫码登录，href自定义CSS样式无效的原因和解决办法
二代旅游网站CMS程序的博客
11-24 6717
微信开放平台网页扫码登录，把相关JS放去进去后，，发现模式的二维码宽度是280px的，对我来说太宽了， 按照官方的说法，  自定义一个样式，把网址填入href里就行了，如下这样：          var obj = new WxLogin({                               id:"login_container",                 
微信扫描二维码登录网站---href设置二维码大小
热门推荐
u010235716的博客
02-29 1万+
苦逼之人，必有苦逼之处：来段代码提提神 微信文档中的参数说明是：href中挑一个自定义的样式链接； 我那个擦啊 ；样式啥的文件都给弄好了 ；结果微信这个二维码死活没有效果。百度出来的解决方案少之又少；终于有人写了一行小字。herf要在公网上。 就是说本地测试的时候。这个herf不能填本地的路径。人家是一个公网的路径。 自定义微信css代码： @CHARSET
微信授权二维码样式修改
weixin_43947294的博客
03-01 3476
问题 微信官方的代码文档 var obj = new WxLogin({ self_redirect:true, id:&quot;login_container&quot;, appid: &quot;&quot;, scope: &quot;&quot;, redirect_uri: &quot;&quot;, state: &quot;&quot;, style: &quot;&qu
Jquery实现网页微信二维码滚动广告效果详解
本文将深入探讨如何在网页设计中利用jQuery实现一种动态且吸引眼球的特效——微信二维码图块滚动效果。该效果常见于各类网站，通过结合用户浏览行为，使二维码图块随着用户的滚动动作进行滚动展示，既提升了用户体验...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值