个人博客网站实现微信扫码登录(新)

这篇具有很好参考价值的文章主要介绍了个人博客网站实现微信扫码登录(新)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

        在不久之前(两年前)我写了一篇同名的博客《个人博客网站实现微信扫码登录(附源码)》,当时只是做一个记录而已。但是没想到会收到很多“猿友”的私聊,“代码跑不起来”、“实现原理”、“测试网址访问不了” 等各种问题。我也都一一解答了。趁着这段时间不是很忙,就在家里将这篇博客重新整理了一下,也对功能上进行了一些优化。 希望各位在技术探索的路上不迷茫。

        在开始正题之前, 我们先聊一下实现原理, 方便更好的带领大家熟悉。我们都知道,微信已然成为了国民软件, 男女老少都离不开它。所以使用微信扫码注册、登录是非常方便的事情。然而当我们的个人网站(博客、论坛)想要接入该功能的时候却发现只对企业 开放。不过这难不倒我们,我们依旧可以实现以 - 个人资质实现博客网站微信扫码登录

如下图所示:就是代码的核心流程, 看起来是比较繁琐, 其实是比较简单的,下面我会对流程拆分讲解。

个人博客网站实现微信扫码登录(新)

 在线测试

由于之前没怎么维护, 导致测试网站时好时坏的。最近我也对网站进行了重构。保证可以稳定运行了。下面是测试地址。

在线测试微信扫码登录https://www.converts.cn/scantest.html

准备工作

1、首先需要注册一个小程序。(注:小程序需要提交审核并上线,如果处于开发版本是没有办法生成二维码图片的)注册地址:小程序注册https://mp.weixin.qq.com/cgi-bin/wx?token=&lang=zh_CN2、需要一个域名,并且域名已经绑定 https 证书。(微信小程序的请求必须要 https), 没有服务器的看这里:【腾讯云】云产品限时秒杀,爆款2核4G云服务器,首年74元https://curl.qcloud.com/jQwrP1L9

好了,到这里准备工作已经做完了, 现在开始解析流程了,由于代码量比较多, 这里就不对代码做过多的解释, 有需要的自己下载。更多的是解析流程。

请求二维码

在流程图中, 这一步有四个步骤需要完成,分别是“1、1.1、1.2、1.3”,其实实际上就可以认为是一个步骤,那就是向微信请求小程序二维码。

1、请求二维码

获取小程序选择不限制数量的。该小程序码可以携带一个 scene参数,并且只能小于等于32位。既然能携带一个参数, 那么我们就可以在参数上做文章了。

获取不限制的小程序码 | 微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/qrcode-link/qr-code/getUnlimitedQRCode.html

个人博客网站实现微信扫码登录(新)

当PC 和 移动端都与服务器建立通讯之后, 手机端的操作,例如登录,注册,都可以根据 WebSocket 传递到后端。并且我们可以通过GUID 的前25位知道手机端要传递的消息给谁(这里可以通过传递参数将手机端的消息传递到PC端) 

2、消息转发

在上一步, 我们的PC移动端都与服务器建立了WebSocket 连接, 那当我们的 移动端 发送一个数据包到服务器,服务器解析移动端传过来的数据包,然后将该消息转发给PC 端,以此可以实现消息互通的效果。如下图

个人博客网站实现微信扫码登录(新)

其实走到这一步, 大致流程就已经走完了。在本篇博客中, 没有什么源码, 全文都是通过流程图带领大家去理解。 下面会贴出源码, 通过简单的配置即可运行测试。

项目源码

下载地址:https://gitee.com/PangTaiYi/WeChatScanLogin文章来源地址https://www.toymoban.com/news/detail-476073.html

到了这里,关于个人博客网站实现微信扫码登录(新)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包赞助服务器费用

相关文章

  • 使用Spring Boot Security 实现多认证 手机号登录 微信扫码登录 微信扫码注册

    使用Spring Boot Security 实现多认证 手机号登录 微信扫码登录 微信扫码注册

    Spring Boot 3.x Spring Security 5.7 Spring Redis MyBatis plus 前端 Vue 公司 最近有个新项目 使用单点登录 sso 百度了一圈 也没怎么找到微信扫码注册的功能于是自己写 需求就是 手机 + 密码登录 微信扫码登录 微信扫码注册 微信二维码 登录 和注册二合一 具体实现 稍后我会说 本教程将指导

    2024年04月10日
    浏览(13)
  • springboot实现微信扫码登录

    springboot实现微信扫码登录

    目录 1,注册微信开发者账号,创建一个应用,获取AppID和AppSecret 2,在Spring Boot项目中引入微信SDK依赖  3,在Spring Boot配置文件中配置AppID和AppSecret 4,创建一个Controller,处理微信登录请求。 5,在启动类中配置WxMpService的Bean 6,在页面中提供微信登录按钮,点击后跳转到授权

    2024年02月04日
    浏览(9)
  • 记录--vue3问题:如何实现微信扫码授权登录?

    记录--vue3问题:如何实现微信扫码授权登录?

    一、需求 微信扫码授权,如果允许授权,则登录成功,跳转到首页。 二、问题 1、微信扫码授权有几种实现方式? 2、说一下这几种实现方式的原理是什么? 3、vue中的微信扫码授权登录,与uniapp和原生小程序的微信授权登录,它们之间有共同点吗? TWO 解决问题,答案速览

    2024年02月13日
    浏览(14)
  • Java 实现微信扫码登录方法(提供前端及后端核心代码)

    Java 实现微信扫码登录方法(提供前端及后端核心代码)

    思路 1、Vue前端页面获取一个公众号的二维码,不是普通二维号,是带有场景值的 2、java后端接收前端的请求,生成一个带时效性的二维码链接返回给前端 3、公众号平台配置服务器接口地址 4、接收到关注或扫码请求并相应处理 5、前端轮询状态,如果检查到验证通过进到下

    2024年02月19日
    浏览(10)
  • JAVA微信扫码登录

    JAVA微信扫码登录

    本帖有两种微信扫码的方式。根据测试公众号进行测试,所以不用担心没有公众号。 因为涉及到微信回调,所以要走本地的话需要进行内网穿透,本贴不包含内网穿透教学,很简单,请自行百度。 测试号地址:https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login 扫码登录后,进

    2024年02月16日
    浏览(17)
  • 网站怎么接入微信扫码支付?

    参考资料:产品中心 - 微信支付商户平台 (qq.com) 付款码支付、JSAPI支付、小程序支付、 Native支付 、APP支付、刷脸支付 用户展示微信钱包内的“付款码”给商家,商家扫描后直接完成支付,适用于线下面对面收银的场景。 线下场所:商户展示一个支付二维码,用户使用微信扫

    2024年02月09日
    浏览(11)
  • 尚医通-day10【微信扫码登录】(内附源码)

    https://open.weixin.qq.com (1)注册开发者账号:准备营业执照 (2)邮箱激活 (3)完善开发者资料 (4)开发者资质认证:1-2个工作日审批、300元 (5)创建网站应用:提交审核,7个工作日审批(免费) (6)熟悉微信登录流程 参考文档:https://developers.weixin.qq.com/doc/oplatform/Web

    2024年02月08日
    浏览(10)
  • 微信扫码登录(new WxLogin)-二维码样式修改

    微信扫码登录(new WxLogin)-二维码样式修改

    例如: .impowerBox .qrcode {width: 180px;} .impowerBox .title {display: none;} .impowerBox .info {width: 180px;} .status_icon {display: none} .impowerBox .status {text-align: center;} 二、自定义二维码样式进行base64加密 在线加密解密网站  三、将解密后的密文添加到href中 注意: 密文前加入  data:text/css;base64,    

    2024年02月13日
    浏览(11)
  • pbootcms对接微信扫码登录代码核心片段和步骤(前后端)

    首先需要在微信公众平台或开放平台中创建应用,并获取到AppID和AppSecret。 在pbootcms中创建一个自定义模板页面(例如:wechat_login.html),并在该页面中添加以下代码,用于生成微信扫码登录的二维码: 创建一个名为wechat_callback.php的文件,用于接收微信的回调请求并获取用户

    2024年02月05日
    浏览(10)
  • 网站使用微信小程序扫码登录的实现方法

    网站使用微信小程序扫码登录的实现方法

    传统网站一般都会使用账号密码登录,但这种方式总有用户会忘记密码,找回密码需要一系列验证,也挺麻烦的,于是学习了一下扫码登录,这种方式不仅不会有忘记密码的烦恼,登录还十分快捷。用户体验较好. 网站端点击小程序图片,弹出小程序码 小程序端授权页面 1、

    2024年02月16日
    浏览(9)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包