微信扫码免密登陆第三方应用平台

最新推荐文章于 2024-04-26 16:12:17 发布
最新推荐文章于 2024-04-26 16:12:17 发布
阅读量1.7k 收藏
点赞数 1
文章标签： 微信开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zxmg951/article/details/100031699
版权

官方文档：https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419316505&token=&lang=zh_CN

开发工具：postMan和Idea
工具类: cn.hutool.http.HttpUtil;(java 模拟发送htttp请求)

第一步，微信用户扫码获取权限得到code
点击链接/或利用js模拟发送请求获取扫码的二维码图片：
GET：https://open.weixin.qq.com/connect/qrconnect?appid=appid&redirect_uri=redirect_uri&response_type=code&scope=snsapi_login

注：appid为你要跳转的第三方网站的appid
在这里插入图片描述
注：redirect_uri为你要跳转的第三方网站的url（提示：url最好用encode加密后的url //百度encode解码）

第二步，在这里插入图片描述
用户扫码后会跳转你指定的链接，code会在链接上显示:（让前端获取链接里面的code，然后传给你。//其实我并不知道java怎么获取…）
用户扫码后跳转的链接
第三步，利用code获取微信扫码用户的AccessToken/unionId/openId
发送Get请求获取AccessToken
GET：https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

返回参数意思：（//如果返回有errcode，你调用失败了…）
AccessToken:微信调用接口的凭证（和Token差不多）
unionId：（对应（网站）appid下的唯一id，As:比如腾讯，腾讯有两个产品：微信/QQ，你扫码微信获取unionId，这个id是微信id，通过微信Id就能找到你微信的信息）
openId：主要有这个Id，腾讯就能找到你（不限那个产品）
expires_in：AccessToken有效时间（7200指2个小时 26060s）

第四步，
利用accessToken和openId获取用户的信息：（//如果返回有errcode，你调用失败了…）
GET：https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID

第五步，设计一张wx表，记录微信用户信息，在user表添加wxId字段，通过该Id进行关联user表。
如果微信扫码登陆的话insert 当前微信用户信息数据，并在user新生成一条数据，并用Stringutils.getUUId生成wxId作关联，在如果有该数据则update。

注：模拟调用wx接口的时候最好写个Util
在这里插入图片描述
注：postMan 同理（收藏夹）
在这里插入图片描述

xzmg951
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信第三方登陆实现-微信浏览器实现弹出提示授权非微信浏览器提供二维码
yueding_h的博客
10-26 1万+
一、使用之前准备工作     首先先用到pc端非微信浏览器使用的二维码方式接入登陆；       1）首先需要在微信开放平台注册，在管理中心创建自己要使用到登陆的应用，并进行认证。           图1、创建应用并审核通过          图2、获取appid和AppSecret          图3、设置后续需要的回调的基本域     2）微信公众平台认证这里就不做截图处理了
微信小程序 扫一扫跳转到外部链接
HelloWord176的博客
07-07 2247
微信是不支持直接跳转到外部的链接，那就真的不能了吗？？？ 我们可以转换一下思维，中间先跳转到其他页面，在通过页面内的<web-view></web-view>标签中的 src 属性进行设置就可以了 在wxml 文件中写： <button bindtap="fun">扫一扫</button> 在js文件中调取微信扫码API方法 fun() { wx.scanCode({ // 微信扫码 调起客户端扫码界面进行扫码 com
Spring Boot携手OAuth2.0，轻松实现微信扫码登录！
最新发布
Yaml4的博客
04-26 1465
✌️大厂全栈码农|毕设实战开发，专注于大学生项目实战开发、讲解和毕业答疑辅导。推荐订阅精彩专栏 👇🏻 避免错过下次更新。
免密码登录服务器
weixin_30549657的博客
06-12 91
https://www.cnblogs.com/augustyang/p/6087155.html 转载于:https://www.cnblogs.com/Baronboy/p/9172475.html
免密登录关闭_微信这个设置如果不关闭，你的微信账号别人就能“免密登录”...
weixin_42107374的博客
01-07 635
现在来看的话，手机这个东西已经成为了我们生活当中必不可缺的一个东西，尤其是我们在过周末或者是放假的时候，一般情况下都会将大量的时间都花费在玩手机上，比如说我们可以玩一些比较热门的手机游戏，或者说可以看一看短视频。虽然现在的手机确实是能够带给我们很大的帮助，但是也说不定在我们不注意的时候，我们个人的一些隐私信息就被泄露出去了，比如说今天小编要跟大家讲的这件事情，就是如果不将微信当中的这个设置关闭的话...
微信公众平台-第三方平台开发（三）扫码授权第三方平台
何时林听@
05-24 1343
授权完成后跳转的地址会带有两个 参数分别是 auth_code 和 expires_in。这是公众号获取调用令牌所需要的code，带着auth_code去后台获取调用令牌并保存下来。web接收preAuthCode。这张图是官方提供的扫码授权流程。引导用户进入扫码画面。
web第三方微信扫码登录.rar
11-20
1. **微信开放平台**: 微信开放平台是腾讯为开发者提供的一个集成了多种服务的平台，包括微信扫码登录功能。开发者需要在此平台上注册并创建应用，获取到必要的AppID和AppSecret，这是实现扫码登录的基础。 2. **...
微信公众平台第三方服务协议.pdf
07-14
微信公众平台第三方服务协议.pdf微信公众平台第三方服务协议.pdf微信公众平台第三方服务协议.pdf微信公众平台第三方服务协议.pdf微信公众平台第三方服务协议.pdf微信公众平台第三方服务协议.pdf
Java实现微信扫码登入的实例代码
08-19
要使用微信扫码登入功能，首先需要去微信开放平台做好开发者资质认证，创建网站应用，然后等待审核通过。 知识点3: 创建网站应用 创建网站应用后，需要填写基本信息，例如应用名称、应用描述、Logo等信息。 知识...
微信第三方平台验证票据获取.rar
08-24
微信官方demo 不能直接用。此demo 已修改并亲测可用。
ASP网页调用微信扫码登录方法
08-17
PC网页调用微信扫码登录例程
微信电脑版，仅输入账号密码，无需二维码
05-30
微信电脑版。 1.仅需输入账号密码，即可登录。 2.无需二维码。
微信自动跳转第三方浏览器指定页面的实现方式
moreone167的博客
02-27 441
微信被认为是目前最具营销价值的营销渠道之一，没有之二，原因很简单，微信是目前超高活跃度的app稳稳第一名，正所谓哪里有流量哪里有江湖，所以无数的营销人的奋斗在微信营销的浪潮中 解决方案：微信中打开链接，自动打开外部浏览器打开页面 微信中点击或打开链接，自动打开外部浏览器下载app。全程完全自动化，无需用户任何手工操作。 这种方案可以说是完美解决微信中下载app的问题。效果如下面这样子： ...
最简单、稳定的免密登录
weixin_34252686的博客
07-04 182
先说下环境：CentOS7 X64. 最近...
远程免密登录
weixin_39154610的博客
12-24 227
1 服务器创建 .ssh文件夹 $ ssh-keygen -t rsa 2 将客户机的 id_rsa.pub 通过scp上次到服务器任意目录（如自行创建的：document目录） $ scp id_rsa.pub root@192.168.1.238:/document 3 进入服务器将 id_rsa.pub文件追写到 .ssh/authorized_keys 文件中 $ cd /docume...
服务器免密码登录
weixin_30859423的博客
01-22 74
1,在办公电脑生成公私钥，将公钥上传到服务器 ssh-keygen -t rsa -P '' -P表示密码，-P ” 就表示空密码，也可以不用-P参数，这样就要三车回车，用-P就一次回车。 2，把办公电脑~/.ssh/id_rsa.pub 内容复制到B机的 /root/.ssh/authorized_keys文件里 3，重启ssh服务 /etc/init.d/ssh...
微信带参数二维码扫描 之后自动登录
l123y123c123的博客
04-30 565
1、服务器配置要启用，才可以接收到用户的订阅事件 2. 3.
三方登录微信登录
qq_42210156的博客
09-02 316
一.在页面加入标签 1.在登录页准备微信登录的按钮 <li><a href="https://open.weixin.qq.com/connect/qrconnect? appid=wxd853562a0548a7d0&redirect_uri=http://bugtracker.itsource.cn/callback.html &response_type=code&scope=snsapi_login&state=1#wechat_redirec
vue3+koa实现第三方登录，比如微信扫码，具体案例
07-16
在Vue 3和Koa中实现第三方登录（比如微信扫码）的过程如下： 1. 创建Vue 3项目：首先，你需要创建一个Vue 3项目。你可以使用Vue CLI来创建一个新的Vue项目，执行以下命令： ``` vue create my-project ``` 按照提示进行配置选择，并等待项目创建完成。 2. 安装依赖：进入到项目目录，执行以下命令安装相关的依赖： ``` cd my-project npm install axios vue-axios ``` 3. 创建登录页面：在Vue项目中创建一个登录页面，可以使用Vue的单文件组件来实现。在你的Vue项目中的`src/views`目录下，创建一个名为`Login.vue`的文件，并添加以下代码： ```html <template> <div> <h2>第三方登录</h2> <div v-if="!isLogged"> <button @click="wechatLogin">微信扫码登录</button> </div> <div v-else> <p>登录成功！</p> <p>{{ userInfo }}</p> </div> </div> </template> <script> import axios from 'axios'; export default { data() { return { isLogged: false, userInfo: null, }; }, methods: { wechatLogin() { // 发起微信扫码登录请求 axios.get('/api/wechat/login').then(response => { // 处理登录成功后的逻辑 if (response.data.success) { this.isLogged = true; this.userInfo = response.data.userInfo; } }).catch(error => { console.error(error); }); }, }, }; </script> ``` 4. 创建Koa后端：接下来，你需要创建一个Koa后端来处理微信扫码登录的逻辑。在项目根目录下，创建一个名为`server.js`的文件，并添加以下代码： ```javascript const Koa = require('koa'); const Router = require('koa-router'); const axios = require('axios'); const app = new Koa(); const router = new Router(); // 处理微信扫码登录的路由 router.get('/api/wechat/login', async (ctx, next) => { try { // 生成一个随机的state参数 const state = Math.random().toString(36).substr(2); ctx.cookies.set('state', state); // 将state存储在cookie中 // 构造微信扫码登录的URL const wechatLoginUrl = `https://wechat.example.com/login?appid=YOUR_APPID&redirect_uri=${encodeURIComponent('http://your-domain.com/api/wechat/callback')}&state=${state}`; ctx.body = { success: true, wechatLoginUrl, }; } catch (error) { console.error(error); ctx.body = { success: false, error: 'Failed to initiate WeChat login', }; } }); // 处理微信扫码登录回调的路由 router.get('/api/wechat/callback', async (ctx, next) => { try { const { state, code } = ctx.query; const storedState = ctx.cookies.get('state'); // 从cookie中获取之前存储的state if (state === storedState) { // 校验state参数是否正确 // 发起获取access_token和openid的请求 const response = await axios.get(`https://wechat.example.com/access_token?appid=YOUR_APPID&secret=YOUR_SECRET&code=${code}&grant_type=authorization_code`); const { access_token, openid } = response.data; // 获取用户信息的请求 const userInfoResponse = await axios.get(`https://wechat.example.com/userinfo?access_token=${access_token}&openid=${openid}`); const userInfo = userInfoResponse.data; // 这里可以将用户信息存储到数据库或进行其他操作 // ... // 返回用户信息给前端 ctx.body = { success: true, userInfo, }; } else { ctx.body = { success: false, error: 'Invalid state parameter', }; } } catch (error) { console.error(error); ctx.body = { success: false, error: 'Failed to handle WeChat login callback', }; } }); app.use(router.routes()); app.listen(3000, () => { console.log('Server is running on http://localhost:3000'); }); ``` 上述代码中，需要将`YOUR_APPID`和`YOUR_SECRET`替换为你自己的微信开放平台的App ID和App Secret。 5. 启动应用：在项目根目录下，执行以下命令启动应用： ``` node server.js ``` 6. 访问登录页面：在浏览器中访问`http://localhost:3000`，你将看到一个点击按钮。点击按钮后，将会发起微信扫码登录的请求，然后跳转到微信扫码页面进行登录。登录成功后，将会返回用户信息并显示在页面上。 以上就是使用Vue 3和Koa实现微信扫码登录的简单案例。请根据实际情况修改代码，并替换其中的具体参数和URL。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值