前后端分离之后，在微信内置浏览器获取openid

最新推荐文章于 2024-05-13 00:11:17 发布
最新推荐文章于 2024-05-13 00:11:17 发布
阅读量3.4k 收藏 1
点赞数 1
文章标签： 后端 java 前端 ViewUI
原文链接：https://my.oschina.net/snxun/blog/1486539
版权

为什么80%的码农都做不了架构师？>>>   hot3.png

以往的试用微信支付获取openid

    1.修改网页授权

    201053_zwOb_2723374.png

201143_bv8V_2723374.png

2.然后根据微信开发文档网页授权进行开发代码

    https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842

3.这是正常的开发

201531_XYrT_2723374.png

201422_njpF_2723374.png

201439_Z3pc_2723374.png

201504_c06X_2723374.png

4.这一块在以往PHP开发中很容易实现，但是如果前后端分离之后，code就不好获取了，

    如果直接用ajax请求图2中的URL会出现跨域的问题。

 

5解决

    前端去获取code，然后把code传给后台，后台再去获取access_token和openid。

    实现

        202018_y7Ah_2723374.png

    后台进行URL拼接之后，再利用js的window.location.href=''打开这个链接，

202517_YlIq_2723374.png

然后前端就可以拿到微信返回的code，后台利用这个code再去请求 

202155_ZR78_2723374.png

这个地址，就可以得到access_token和openid

    

转载于:https://my.oschina.net/snxun/blog/1486539

weixin_33955681
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信公众号H5页面中获取openId
MrNoboday
09-20 1万+
必要条件 已经认证的公众号（企业号可以，个人号是不能绑定H5的） https认证域名，没有认证的域名微信中不能配置回调地址 微信公众平台认证通过，并创建app 步骤 获取code （需要配置选取scope=snsapi_base模式，code五分钟过期，使用过一次过期） 通过code就可以配置参数获取openId（注意这个openId和access_token是一起获取的） 没错，只需要...
详解Vue微信授权登录前后端分离较为优雅的解决方案
08-27
在前后端分离的架构中，实现Vue微信授权登录是一个常见的需求。这种优雅的解决方案主要针对Vue.js单页应用（SPA）场景，确保用户在访问特定页面时能够顺畅地完成微信授权，同时保持良好的用户体验。以下将详细介绍这...
小程序商城笔记
07-21 996
1、三端分离： 服务端：主要是查询数据库，获取数据； 客户端：向服务端发送请求，完成自身逻辑； CMS：向服务端发送请求，实现发货与发送微信信息。（CMS就是公司内部用户用的，主要功能是添加、修改商品这一类功能） 2、基于token管理权限：登录和有些用户有权限看什么，有些用户没有权限看什么。 3、 ORM模型（面向对象的模型），简单理解为：数据库中的一张表就是一个对象。...
H5网页获取公众号openid,access token,等用户信息
haimianjun123的博客
07-18 3858
H5页面获取openid
微信网页内获取用户openid
最新发布
代元培
05-13 231
微信网页内获取用户openid
H5页面获取微信用户openid极简攻略
latinhui的博客
02-23 7503
背景 之前每次写到获取openid 就觉得特别麻烦，网上很多代码段会把一部分功能分开写，确实相对合理，但是对于复制粘贴代码来说依赖越少越方便，所以根据自己的经验做了一个极简的复用代码 前置条件 1.公众号已认证，否则会出现“Scope 参数错误或没有 Scope 权限” 2.公众号后台设置安全域名 【公众号设置】=》【功能设置】=》【JS接口安全域名 】&【网页授权域名】 代码 前端 getOpenId(){ const code = getUrlParam('code') // 截取路径中的
JS方式 获取微信openid 【html5+jquery】
jugt的博客
04-02 1781
https://blog.csdn.net/yelin042/article/details/79707855 $(function () { var wxopenid=getcookie('wxopenid'); var key=getcookie('key'); if (key==''){ var access_code=GetQueryString('code'); if (wxopenid==""){ if (acc.
TP5微信公众号获取openid
weixin_52365465的博客
03-30 529
1.在公众号->设置->公众号设置->功能设置中添加’业务域名’,‘JS安全接口域名’,‘网页授权域名’ 2.控制器代码如下 public function test() { //获取config中设置的appid,secret $config = config('weixin'); if (!isset($_GET['code']) || $_GET['code'] == '') { .
微信小程序获取OpenID +php后端完整源代码
08-19
在微信小程序的开发过程中，获取用户唯一标识OpenID是非常关键的步骤，它能够帮助开发者识别并管理用户，实现个性化服务和数据统计。本文将详细介绍如何通过微信小程序和PHP后端来获取OpenID，并对提供的源代码进行...
微信小程序获取用户openid的实现
01-03
调用接口获取登录凭证（code）进而换取用户登录态信息，包括用户的唯一标识（openid） 及本次登录的 会话密钥（session_key）。用户数据的加解密通讯需要依赖会话密钥完成。 2、code 换取 session_key 这是一个 ...
微信小程序获取openid小程序端及服务器端代码
03-29
//微信公众号平台申请的appid var appSecret = ' ';//微信公众号平台申请的app secret var js_code = res.code;//调用登录接口获得的用户的登录凭证code wx.request({ url: '...
微信公众号开发获取openid和微信分享和公众号配置验证，网页授权后台代码
04-07
微信公众号开发获取openid和微信分享和公众号配置验证，网页授权后台代码，获取openid，微信分享，公众号配置验证，代码齐全
如何获取微信公众号openid
九八呀呀呀呀
06-15 2万+
如何获取微信公众号openid
微信小程序中获取微信公众号授权获得公众号的openId（此方式仅适用于短时间的活动，长期项目还是需要维护基础表）
lianghui1986的专栏
06-02 2769
准备工作：小程序和公众号需要绑定在同一开放平台下（这样会有unionid，用来验证是否为同一用户）；公众号设置好白名单，网页授权域名（这个要和小程序的api访问域名一致）3.小程序中新增一个web-view页面，url放html的地址。步骤：1.准备一个跳转的html页面，放在用网页授权域名可以访问到的地址。2.写一个接收code获取openid的接口。
html5+jquery获取微信openid
热门推荐
IT人生
03-20 6万+
最近在修改一个移动商城，由于wap端是HTML5的，还大量使用了art模板技术，一开始修改很不适应，而且实现HTML5取openid一直没能实现很好的实现，经过对获取原理的理解和学习，终于还是实现了HTML获取微信openid,而且改动不大，闲话少说
微信登录的流程与实现
Sakuraaaaaaa的博客
09-16 1389
微信登录： 流程， 二维码生成， 配置本地host和请求端口， 获取用户信息。
微信平台网页版获取用户的openid
u010314910的博客
11-06 1049
网页上获取微信用户信息，微信平台网页版获取用户openid
微信公众平台开发（四）——微信网页授权：获取用户openid&用户基本信息
不愿意做鱼的小鲸鱼の博客
03-24 9175
在开发中，如果web产品需要使用到微信的功能,比如微信授权登录、微信支付、微信投票等，我是开发的东东是一个web项目，然而如果需要接入微信的话，就需要使用道微信的微信网页开发相关的功能。
微信H5端网页授权流程（在H5中的openid获取，网页绑定微信）
F2691898750的博客
04-15 1万+
这里说的是scope为snsapi_base这种方式，用于获取每一个微信用户都只有一个的openid，作用是让用户使用微信绑定当前网页，获取微信的H5支付的必要参数之一。1、先准备一个结果页面，即为，告知用户当前是否获取到openid结果的页面（就是一个白页面，上面一行字，‘您已成功绑定微信’或‘微信绑定失败，请重新绑定’）；判断是否为微信浏览器，如果为微信浏览器，弹出提示框，用户确认一下绑定防止误触（这一步为用户体验优化），确认绑定直接请求链接，然后到结果页面进行上述流程；①、客户拥有自己的公众号。
微信浏览器获取openid
04-01
要在微信浏览器中获取openid，需要进行以下步骤： 1. 引入微信JS SDK 在网页中引入微信JS SDK，可以通过以下代码实现： ``` <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> ``` 2. 配置微信JS SDK 在JS代码中，需要进行微信JS SDK的配置，例如： ``` wx.config({ debug: false, appId: 'your_app_id', timestamp: 1594736109, nonceStr: 'your_nonce_str', signature: 'your_signature', jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage'] }); ``` 其中，appId、timestamp、nonceStr和signature需要在服务器端进行计算和签名，并将结果传递给客户端。可以参考微信官方文档进行计算和签名。 3. 获取用户授权 在JS代码中，需要调用微信JS SDK提供的接口，获取用户授权，例如： ``` wx.ready(function() { wx.getUserInfo({ success: function(res) { var userInfo = res.userInfo; var nickName = userInfo.nickName; var avatarUrl = userInfo.avatarUrl; var gender = userInfo.gender; //性别 0：未知、1：男、2：女 var province = userInfo.province; var city = userInfo.city; var country = userInfo.country; } }); }); ``` 在用户授权后，可以获取到用户的基本信息，包括头像、昵称、性别、地区等。 4. 获取openid 通过微信JS SDK提供的接口，可以获取用户的openid，例如： ``` wx.ready(function() { wx.login({ success: function(res) { if (res.code) { // 发起网络请求 wx.request({ url: 'https://your.domain.com/api/getOpenId', data: { code: res.code }, success: function(res) { var openid = res.data.openid; console.log(openid); } }) } else { console.log('登录失败！' + res.errMsg) } } }); }); ``` 在获取到用户的code后，可以将code发送到服务器端，进行openid的获取。服务器端需要进行相应的处理，包括获取access_token、获取openid等。可以参考微信官方文档进行开发。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值