首页 > 其他分享 >H5调起微信扫一扫

H5调起微信扫一扫

时间:2024-01-23 16:01:16浏览次数:25  
标签:map String url 微信 H5 appid ticket 调起 ticketObject

uni-app:


import jWeixin from 'jweixin-module';

 

 

let allowUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${WXappid}&redirect_uri=${encodeURIComponent(WXredirectUrl)}&response_type=code&scope=${WXscope}&state=STATE#wechat_redirect`;

  
window.location.replace(allowUrl);

  
wxGetTicketInfo({urlInfo: location.href.split('#')[0]}).then(res=>{

    jWeixin.config({

     debug: false,  
     appId: res.data.appid, // 必填,公众号的唯一标识

     timestamp: res.data.timestamp, // 必填,生成签名的时间戳

     nonceStr: res.data.noncestr, // 必填,生成签名的随机串

        signature: res.data.signature,// 必填,签名

     jsApiList: this.jsApiList // 必填,需要使用的JS接口列表

    });

})

  
  
jWeixin.scanQRCode({

	needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,

	scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有

	success: function (res) {

      

	},

	fail: function(err){

  // console.log('扫描失败:',err);

  uni.showModal({

  	title:'温馨提示',

  	content:'扫描失败,请重新扫码',

  	showCancel:false,

  	confirmText:'我知道了'

  })

	}

});



后端接口:

 

@RequestMapping("/login")

public void login(HttpServletResponse response) throws IOException {

	int type = weChatScan.getType();

    String redirect_uri = "http://xxx.xxx.xxx.xxx/api/scan/wxCallBackInfo"

	//请求地址

	String url = "https://open.weixin.qq.com/connect/oauth2/authorize" +

  	"?appid=" + appid +

  	"&redirect_uri=" + URLEncoder.encode(redirect_uri, "UTF-8") +

  	"&response_type=code" +

  	"&scope=" + baseScope +

  	"&state=STATE#wechat_redirect";

	//重定向

	String s = HttpUtil.get(url);

	response.sendRedirect(url);

}

  
// 回调方法

@GetMapping("/wxCallBackInfo")

public void wxCallBackInfo(WeChatScanDto weChatScan, HttpServletResponse response, @RequestParam("code") String code) {

	Map<String, Object> resultMap = new HashMap<String, Object>();

	String url = "https://api.weixin.qq.com/sns/oauth2/access_token" +

  	"?appid=" + appid +

  	"&secret=" + appsecret +

  	"&code=" + code +

  	"&grant_type=" + grant_type;

	try {

  String s = HttpUtil.get(url);

  //返回结果的json对象

  JSONObject resultObject = JSON.parseObject(s);

  String openid = resultObject.getString("openid");

  response.sendRedirect(scan_url + "?openId=" + openid);

	} catch (Exception e) {

  String message = e.getMessage();

  AesException aesException = new AesException(AesException.NoBindBuffer);

  if (!aesException.getMessage().equals(message)) {

  	message = "微信扫码失败,请联系管理员!";

  }

	}

}

  
//获取前端所需的ticket

@GetMapping("/wxGetTicketInfo")

public AjaxResult wxLogin(HttpServletRequest request, String urlInfo) {

	WxConfig wxConfig = SpringUtils.getBean(WxConfig.class);

	String accessToken = redisCache.getCacheObject("wx_access_token");

	if(StringUtils.isEmpty(accessToken)){

  new WxUtil().createWxAccessToken();

  accessToken = redisCache.getCacheObject("wx_access_token");

	}

	String ticket = redisCache.getCacheObject("wx_ticket");

	Map<String,String> map = redisCache.getCacheObject("wx_signature_map");

	if(StringUtils.isEmpty(ticket)){

  String ticketUrl = wxConfig.getTicket_url() + "?access_token=" + accessToken + "&type=jsapi";

  try{

  	String ticketInfo = HttpUtil.get(ticketUrl);

  	JSONObject ticketObject = JSON.parseObject(ticketInfo);

  	String errcode = ticketObject.getString("errcode");

  	if (!"0".equals(errcode)) {

    logger.info(ticketObject.toString());

    new WxUtil().createWxAccessToken();

    accessToken = redisCache.getCacheObject("wx_access_token");

    ticketUrl = wxConfig.getTicket_url() + "?access_token=" + accessToken + "&type=jsapi";

    ticketInfo = HttpUtil.get(ticketUrl);

    ticketObject = JSON.parseObject(ticketInfo);

  	}

  	logger.info(ticketObject.toString());

  	ticket = ticketObject.getString("ticket");

  	Integer ticketExpiresIn = ticketObject.getInteger("expires_in");

  	redisCache.setCacheObject("wx_ticket", ticket, ticketExpiresIn, TimeUnit.SECONDS);

  	String noncestr = SHA1Util.randomUUID();//随机字符串

  	String timestamp = String.valueOf(System.currentTimeMillis()/1000);//时间戳

  	//4获取url

  	// 根据项目需要获取对应的url地址

  
  	//5、将参数排序并拼接字符串

  	String str = "jsapi_ticket=" + ticket + "&noncestr=" + noncestr + "×tamp=" + timestamp + "&url=" + urlInfo;

  
  	//6、将字符串进行sha1加密

  	String signature = SHA1Util.SHA1(str);

  	map = new HashMap<String,String>();

  	map.put("urlInfo", urlInfo);

  	map.put("timestamp", timestamp);

  	map.put("ticket", ticketObject.getString("ticket"));

  	map.put("noncestr", noncestr);

  	map.put("signature", signature);

  	map.put("appid", wxConfig.getAppid());

  	redisCache.setCacheObject("wx_signature_map", map);

  }catch (Exception e){

  	logger.error("失败", e);

  	return AjaxResult.error("获取签名失败");

  }

	}

	return AjaxResult.success(map);

}

标签:map,String,url,微信,H5,appid,ticket,调起,ticketObject
From: https://blog.51cto.com/momo1226/9380737

相关文章

  • 微信小程序高度适配
    参考文章【微信小程序:用rpx和wx.getSystemInfoSync()来适配屏幕高度-CSDN博客】1.小程序的任何机型的宽度固定为750rpx;为了适配不同设备的高度可以通过下面的公式转化750/设备宽度=屏幕设置高度/设备高度所以自适应屏幕应该设置的高度=750*设备高度/设备宽度2.获取设备信......
  • 微信小程序-wx:key的作用为什么不能使用index
    wxml中的代码为<viewclass="swiperContent"><swiper indicator-dots="true"autoplay="true"><swiper-itemwx:for="{{bannerList}}"wx:key="bannerId"><imagesrc="{{ite......
  • 利用Taro框架搭建基于React项目并编译成微信小程序
    Taro是一个开放式跨端跨框架解决方案,支持使用React/Vue/Nerv等框架来开发微信/京东/百度/支付宝/字节跳动/QQ/飞书小程序/H5/RN等应用。现如今市面上端的形态多种多样,Web、ReactNative、微信小程序等各种端大行其道。当业务要求同时在不同的端都要求有所表现的时候,针对不......
  • 微信小程序如何获取当前日期时间
    Hello大家好!我是咕噜铁蛋,获取当前日期时间是小程序中经常会用到的一个功能。因此,在本文中,我通过科技手段给大家收集整理了下,今天我将向大家介绍如何在微信小程序中获取当前日期时间的方法,并分享一些实用技巧和注意事项。一、获取当前日期时间的方法在微信小程序中,获取当前日期时间......
  • uniapp web-view h5中左滑会退出app解决办法,超简单
    只需要在app中有web-view组件的页面,onload中加入一下代码即可支持vue2,vue3constwebview=plus.webview.currentWebview();//获取窗口//eslint-disable-next-lineno-undefplus.key.addEventListener('backbutton',function(){//监听返回事件console.log......
  • 监听个人微信收款,实现扫码充值
    之前开发的博客论坛,随着用户量不断增加,服务器成本越来越大想着实现会员制回点服务器成本,经过一番研究,发现个人是不能开通微信的收款功能的参考了大部分个人站点,都是使用第三方卡密平台进行发卡我也去某密注册了一个账号,因为手续费、提现规则等各种原因,还是放弃了...业务场景分......
  • 微信小程序 canvas
    页面绑定canvas<viewstyle='width:0px;height:0px;overflow:hidden;'><!--//调试时候可用直接将canvas显示在页面上//调试完成将canvas隐藏<canvasid="canvasContaner"type="2d"></canvas>--><canvasid="canvasContaner&q......
  • 微信小程序开发uniapp
    1由于上面的uniapp要微信开发者路径 2.我们就按要求去下载一个微信开发者工具https://developers.weixin.qq.com/miniprogram/dev/devtools/stable.html 3.这里我们正常下载就可以然后打开后会有一个二维码,我们微信扫一下二维码就登陆成功了然后说回上面的下载的路径填写......
  • 初中英语优秀范文100篇-064WeChat,a New Way of Life-微信,一种新的生活方式
    PDF格式公众号回复关键字:SHCZFW064记忆树1Inmyopinion,usingWeChattochatisanewwayoflife.翻译在我看来,使用微信聊天是一种新的生活方式。简化记忆微信句子结构Inmyopinion介绍性短语,用于表达作者的观点主语:"usingWeChattochat"(使用微信聊天)......
  • 记录--移动端 H5 Tab 如何滚动居中
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助移动端H5Tab如何滚动居中Tab在PC端、移动端应用都上很常见,不过Tab在移动端比PC端更复杂。为什么呢?移动端设备屏幕较窄,一般仅能展示4~7个Item。考虑到用户体验,UI往往要求程序员实现一个功能——......