先贴一个微信开发文档教程 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. Java并发编程-Unsafe实现原理与Unsafe应用解析

    前言 Unsafe是位于sun.misc包下的一个类,主要提供一些用于执行低级别.不安全操作的方法,如直接访问系统内存资源.自主管理内存资源等,这些方法在提升Java运行效率.增强Java语言底层资源 ...

  2. Cannot instantiate the type Map

    今天在使用Map中犯了个低级错误,记录一下: 打算使用map为一个视频List观看记录的统计标识,key为vid,value默认为false,当该key已经统计,标识value为true,初始实例化M ...

  3. elasticsearchBouncing Results问题

    bouncing results问题,两个document排序,field值相同:不同的shard上,可能排序不同:每次请求轮询打到不同的replica shard上:每次页面上看到的搜索结果的排序都 ...

  4. 阿里巴巴--mysql中Mysql模糊查询like效率,以及更高效的写法

    在使用msyql进行模糊查询的时候,很自然的会用到like语句,通常情况下,在数据量小的时候,不容易看出查询的效率,但在数据量达到百万级,千万级的时候,查询的效率就很容易显现出来.这个时候查询的效率就 ...

  5. 几个超级实用但很少人知道的 VS 技巧

    大家好,今天分享几个我知道的实用 VS 技巧,而这些技巧我发现很多人都不知道.因为我经常在工作中遇到:我在同事电脑上解决问题,或在会议上演示代码示例时,使用了一些 VS "骚"操作 ...

  6. Python 简明教程 --- 17,Python 模块与包

    微信公众号:码农充电站pro 个人主页:https://codeshellme.github.io 正确的判断来源于经验,然而经验来源于错误的判断. -- Fred Brooks 目录 我们已经知道函 ...

  7. STM32内存受限情况下摄像头驱动方式与图像裁剪的选择

    1.STM32图像接收接口 使用stm32芯片,128kB RAM,512kB Rom,资源有限,接摄像头采集图像,这种情况下,内存利用制约程序设计. STM32使用DCMI接口读取摄像头,协议如下. ...

  8. 入门大数据---Sqoop简介与安装

    一.Sqoop 简介 Sqoop 是一个常用的数据迁移工具,主要用于在不同存储系统之间实现数据的导入与导出: 导入数据:从 MySQL,Oracle 等关系型数据库中导入数据到 HDFS.Hive.H ...

  9. eclipse在debug模式下鼠标移动到变量上不显示值的问题

    在eclipse中调试时,鼠标移动到变量上不显示值,使用ctrl+shift+i,或者通过配置达到目的: Window->Preferences->Java->Editor-> ...

  10. apply()方法和call()介绍

    我们发现apply()和call()的真正用武之地是能够扩充函数赖以运行的作用域. 1.call,apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的 ...