先贴一个微信开发文档教程 https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html

大家可以看教程操作,我说说我在写的时候遇到的一些问题,供大家参考

1、redirect_url是扫码确认后重定向地址,需要一个自己写的页面地址,自己通过这个地址的url获取后端获取用户微信信息所需要的code。

2、redirect_url需要在微信开放平台设置,然后将redirect_url通过encodeURIComponent转码后方可正常获取二维码。

3、如果提示redirect_url参数错误,检查下参数是否是自己项目的一些参数。比如appid、redirect_url地址是否在开放平台配置。

4、内嵌二维码可以自己编辑样式,先写好样式后,将样式转成base64,放入href中即可。

5、self_redirect设置成true,意思是在当前二维码所在的iframe中跳转,默认扫码方式就设置成true

如果是内嵌二维码,就必须设置成false,否则就会出现如下图情况,在二维码嵌入的地方打开重定向的网页。

-------------------------------------------------------------

无论什么框架中使用都是在页面加载的时候引入  http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js,然后根据文档写api即可

单页面可以通过以下方式在组件创建的时候引入,在组件销毁前移除即可

create () {
const s = document.createElement('script')
s.type = 'text/javascript'
s.src = 'http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js'
document.body.appendChild(s)
}

以上是我所遇到的所有问题,希望对大家有所帮助。

微信扫码登陆js的更多相关文章

  1. 分享一下,PHP实现第四方QQ微信扫码登陆,不接入qq互联以及微信开发者平台就可以实现用户对接鹅厂,phpQQ微信扫码登陆

    自己抓的QQ包以及整合了网上一些已经封装好了的代码具体如下:QQ: <?php class QQ extends Curl_Api { //获取登录验证码 public function QRc ...

  2. 微信扫码登陆(JAVA)

    在web端用到weChat扫码登录,在手机扫码登陆成功后,跳转到相应的界面. 1.第一步请求code 调用接口:https://open.weixin.qq.com/connect/qrconnect ...

  3. PC 微信扫码登陆

    目录 1.注册微信开发平台 2.微信开发平台添加网站应用 3.PC微信登录流程介绍 4.获取用户基本信息(UnionID机制) 1.注册微信开发平台 官网网址 自行注册,需要注意的是注册邮箱号不用与腾 ...

  4. 微信扫码登陆,qq登陆,微博登陆等第三方登陆成功后返回原来的页面并进行跳转

    原理很简单,主要是利用到window.open的第二个属性,name 前端: 原来的网页给window命名为 window.name="single" window.open(“第 ...

  5. asp源码微信扫码授权登陆电脑版

    网站接入微信扫码登录并获取用户基本信息(完美绕过微信开放平台)电脑版网站实现微信扫码登录,注册会员还要设密码太麻烦,会员也记不住密码,采用微信扫码登录网站更方便,会员无需设密码,用他的微信做为系统登录 ...

  6. php实现微信扫码自动登陆与注册功能

    本文实例讲述了php实现微信扫码自动登陆与注册功能.分享给大家供大家参考,具体如下: 微信开发已经是现在程序员必须要掌握的一项基本的技术了,其实做过微信开发的都知道微信接口非常的强大做起来也非常的简单 ...

  7. PHP实现微信扫码自动登陆与注册,参考实例

    微信开发已经是现在phper必须要掌握的一项基本的技术了,其实做过微信开发的都知道微信接口非常的强大做起来也非常的简单,这里我们一起来看一个微信自动登陆注册的例子. php 微信扫码 pc端自动登陆注 ...

  8. C#开发微信门户及应用(45)--微信扫码登录

    在前面随笔<C#开发微信门户及应用(41)--基于微信开放平台的扫码登录处理>介绍了基于微信开放平台接口实现的微信扫码直接登录的过程.本篇介绍对扫码登录的一些改进和处理,以便更方便应用在实 ...

  9. PC 端微信扫码注册和登录

    一.前言 先声明一下,本文所注重点为实现思路,代码及数据库设计主要为了展现思路,如果对代码效率有着苛刻要求的项目切勿照搬. 相信做过微信开发的人授权这块都没少做过,但是一般来说我们更多的是为移动端的网 ...

随机推荐

  1. Spring插件安装 - Eclipse 安装 Spring 插件详解(Spring Tool Suite)

    安装完成后重启eclipse即可新建spring工程

  2. Java前端面试题总结

    Java前端面试题总结 简单说一下HTML,CSS,javaScript在网页开发中的定位? HTML:超文本标记语言,定义网页的结构 CSS:层叠样式表,用来美化页面 JavaScript:主要用来 ...

  3. Python实现监测抖音在线时间,实时记录一个人全天的在线情况

    前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:小dull鸟 今天给大家分享一篇有趣的文章,灵感来自于前几天与室友的 ...

  4. linux网络编程-socket(1)

    上面是对应的IpV4的地址结构: sin_len整个结构的大小 sin_family协议族,对应Tcp固定为AF_INET,除了tcp协议外还支持unix域协议等 sin_port socket通信的 ...

  5. Easy [还是概率DP思想……]

    题目描述 某一天\(WJMZBMR\)在打\(osu\)~~~但是他太弱逼了,有些地方完全靠运气\(QaQ\) 我们来简化一下这个游戏的规则 有\(n\)次点击要做,成功了就是\(o\),失败了就是\ ...

  6. Spring Cloud Alibaba基础教程:Sentinel Dashboard中修改规则同步到Apollo

    在之前的两篇教程中我们分别介绍了如何将Sentinel的限流规则存储到Nacos和Apollo中.同时,在文末的思考中,我都指出了这两套整合方案都存在一个不足之处:不论采用什么配置中心,限流规则都只能 ...

  7. Redis 6.0 访问控制列表ACL说明

    背景 在Redis6.0之前的版本中,登陆Redis Server只需要输入密码(前提配置了密码 requirepass )即可,不需要输入用户名,而且密码也是明文配置到配置文件中,安全性不高.并且应 ...

  8. Code Forces 796C Bank Hacking(贪心)

    Code Forces 796C Bank Hacking 题目大意 给一棵树,有\(n\)个点,\(n-1\)条边,现在让你决策出一个点作为起点,去掉这个点,然后这个点连接的所有点权值+=1,然后再 ...

  9. MyBatis和Spring整合的奥秘

    本篇博客源码分析基于Spring 5.1.16.RELEASE,mybatis-spring 2.0.0,较高版本的mybatis-spring源码有较大区别. Spring之所以是目前Java最受欢 ...

  10. 12.Clear Flags属性与天空盒

    选中Hierarchy面板的摄像机,然后在右侧Inspector面板的Clear Flags属性可以找到有如下选项, SkyBox:天空盒(默认效果,让场景看着有一个天空) Solid Color:固 ...