先贴一个微信开发文档教程 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. Python-16-分配参数

    与收集参数相反,这里用*和**分配参数   def add(x, y):          return x + y   使用*分配元组 params = (1, 2) >>> ad ...

  2. php - 二维数组转一维数组总结

    二维数组转一维数组总结 例如将如下二位数组转以为以为一维数组 $records = [ [ 'id' => 2135, 'first_name' => 'John', 'last_name ...

  3. MTPuTTy使用

    在开发过程中我们常常会有连接远程 lunix 服务器的需求,这个时候我们需要一个工具来帮助我们做这件事,而这类工具就是远程连接工具.常见的工具有XShell,SecureCRT,Putty等.这里我选 ...

  4. 前端基础:深入浅出 TCP/IP 协议栈

    一个主机的数据要经过哪些过程才能发送到对方的主机上 参考:https://www.cnblogs.com/onepixel/p/7092302.html 首先我们梳理一下每层模型的职责: 链路层:对0 ...

  5. html+css快速入门教程(4)

    练习 1.网易考拉下拉菜单 2.爱奇艺新闻 3.ps滤镜菜单 4.爱奇艺列表 7 布局 7.1 盒子模型 网页设计,首先要做好整体的布局,网页布局就是将不同的元素按照一定的规则放置在浏览器的不同位置, ...

  6. 看看有哪些 Web 攻击技术.

    一.前言 HTTP 协议具有无状态.不连接.尽最大努力的特点,对于 Web 网站的攻击基本也是针对 HTTP 协议的这些特点进行的.比如无状态的特点,就要求开发者需要自行设计开发"认证&qu ...

  7. Data types 'int' and 'float'

    The type int means that the variables listed are integers; by contrast with float, which means float ...

  8. 缓存数据库之redis

    NoSQL(NoSQL = Not Only SQL ),意即“不仅仅是SQL”,泛指非关系型的数据库,NoSQL数据库的产生就是为了解决大规模数据集合多重数据种类带来的挑战,尤其是大数据应用难题 N ...

  9. 每日一题 - 剑指 Offer 42. 连续子数组的最大和

    题目信息 时间: 2019-06-30 题目链接:Leetcode tag: 动态规划 难易程度:简单 题目描述: 输入一个整型数组,数组里有正数也有负数.数组中的一个或连续多个整数组成一个子数组.求 ...

  10. selenium 怎么查找定位鼠标移上去显示,移开鼠标就消失的内容

    场景:鼠标移动到一级菜单上二级菜单才显示,移开鼠标二级菜单就消失,如何查找定位二级菜单 操作: 1.打开F12,点击sources 2.鼠标移动到一级菜单“工单管理” 3.按下键盘“Ctrl+\”,暂 ...