微信开放平台微信登录-扫码登录

最新推荐文章于 2024-07-03 14:50:29 发布

qq_41712828

最新推荐文章于 2024-07-03 14:50:29 发布

阅读量1.5k

点赞数

分类专栏：工作笔记文章标签： php

本文链接：https://blog.csdn.net/qq_41712828/article/details/104757614

版权

本文介绍了如何在后台实现微信扫码登录功能。首先，需要在微信开放平台获取appid，并设置回调链接。扫码登录有两种方式：跳转至微信网页生成的二维码，或者将二维码内嵌到自己的网站。回调处理中，通过code换取用户信息。详细步骤参照官方文档。

摘要由CSDN通过智能技术生成

需求：后台需要添加微信扫码登录。
首先需要阅读官方文档，了解大致过程。介绍有两种微信扫码，一是跳转到微信网页生成的二维码进行扫码，二是把二维码内嵌到自己的网站页面。下面微信文档。
https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html
准备：
1.appid 开放平台查找
2.redirect_uri 回调链接跟开放平台配置一致，使用时需要urlEncode处理。用php 处理直接用urlEncode,用JavaScript处理用urlEncode没反应的话就用，encodeURIComponent。
微信文档截图
例一，跳转扫码


<?php
$appid = "填写你的APPID";
$redirect_uri = UrlEncode("http://www.baidu.com/login.php");
$data = time();
$state = MD5($data);
//跳转页面
echo "<script>location.href=\"https://open.weixin.qq.com/connect/qrconnect?appid=$appid&redirect_uri=$redirect_uri&response_type=code&scope=snsapi_login&state=$state#wechat_redirect\";</script>";
?>

效果
在这里插入图片描述
情形二：把二维码内嵌到网页

<!-- 引入微信扫码登录js文件 -->
<script type="text/javascript" src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
</head>
<body>
  <!-- 放置二维码的div -->
  <div id="login_container"></div>
</body>
<script type="text/javascript">
var obj = new WxLogin({
   
  self_redirect:true,
  id:"login_container", //二维码容器id
  appid: "wxbdc5610cc59c1631", 
  scope: "snsapi_login", 
  redirect_uri: encodeURIComponent("http://"+window.location.host+"/..."), 
  state: Math.ceil(Math.random()*