config接口注入权限验证配置(带有扫一扫的功能)

2023-10-11 05:10

本文主要是介绍config接口注入权限验证配置(带有扫一扫的功能),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

本篇文章适合小白,一开始使用JSSDK调用微信接口的时候需要在config接口注入权限验证配置。这一步中最难的是签名的生成。

首先我来简述一下签名是怎么生成的

1.根据公众号的APPID 和 APPSECRET生成Access Tocken。

2.根据access tocken 生成 jsapi_ticket。(access tocken和jsapi_ticket他们都具有时效性,是7200秒)

3.根据jsapi_ticket、noncestr(随机生成数)、timestamp(时间戳)、url(当前网页地址)生成字符串string1,在对String1进行sha1的加密  生成了 签名


 

下面在说一下前端是怎么使用js在config接口注入权限验证配置的:

一、静态的注入

静态注入很简单就想微信开发文档中的一样,给固定值即可。但是这边

二、动态注入

后台去负责编写模块,前端通过ajax去获取这几个值具体写法如下:

<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>签名</title><button id="searchButton">查询</button>
</head>
<body>
<script src="../../plugins/jquery/jquery-1.10.2.min.js"></script>
<script src="../../js/url.js"></script>
<script src="../../js/tools/weiixn.js"></script>
<script>var siteUrl = window.location.href;console.log(siteUrl);var times;var nonceStr;var signature;$(document).ready(function () {$.ajax({async:'false',type:'GET',url:testService+"/api/Index/GetOauthTicket?url="+siteUrl,dataType:"JSON",success:function(res) {console.log(res)times = res.timestamp;nonceStr = res.noncestr;signature = res.signature;wx.config({debug: true,appId:'wx51642718e0f550b6',timestamp:times,nonceStr:nonceStr,signature:signature,jsApiList : [ 'checkJsApi', 'scanQRCode','translateVoice' ]});//end_config},})})wx.error(function(res) {alert("出错了:" + res.errMsg);});wx.ready(function() {wx.checkJsApi({jsApiList : ['scanQRCode'],success : function(res) {console.log(res)}});//扫描二维码$(document).on('click',function () {wx.scanQRCode({needResult : 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,scanType : [ "qrCode", "barCode" ], // 可以指定扫二维码还是一维码,默认二者都有success : function(res) {var result = res.resultStr; // 当needResult 为 1 时,扫码返回的结果document.getElementById("wm_id").value = result;//将扫描的结果赋予到jsp对应值上alert("扫描成功::扫描码=" + result);}});})});//end_ready
</script>
</body>
</html>

 

 

这篇关于config接口注入权限验证配置(带有扫一扫的功能)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/185745

相关文章

Java实现文件图片的预览和下载功能

《Java实现文件图片的预览和下载功能》这篇文章主要为大家详细介绍了如何使用Java实现文件图片的预览和下载功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... Java实现文件(图片)的预览和下载 @ApiOperation("访问文件") @GetMapping("

SpringCloud动态配置注解@RefreshScope与@Component的深度解析

《SpringCloud动态配置注解@RefreshScope与@Component的深度解析》在现代微服务架构中,动态配置管理是一个关键需求,本文将为大家介绍SpringCloud中相关的注解@Re... 目录引言1. @RefreshScope 的作用与原理1.1 什么是 @RefreshScope1.

opencv图像处理之指纹验证的实现

《opencv图像处理之指纹验证的实现》本文主要介绍了opencv图像处理之指纹验证的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录一、简介二、具体案例实现1. 图像显示函数2. 指纹验证函数3. 主函数4、运行结果三、总结一、

SpringKafka消息发布之KafkaTemplate与事务支持功能

《SpringKafka消息发布之KafkaTemplate与事务支持功能》通过本文介绍的基本用法、序列化选项、事务支持、错误处理和性能优化技术,开发者可以构建高效可靠的Kafka消息发布系统,事务支... 目录引言一、KafkaTemplate基础二、消息序列化三、事务支持机制四、错误处理与重试五、性能优

SpringIntegration消息路由之Router的条件路由与过滤功能

《SpringIntegration消息路由之Router的条件路由与过滤功能》本文详细介绍了Router的基础概念、条件路由实现、基于消息头的路由、动态路由与路由表、消息过滤与选择性路由以及错误处理... 目录引言一、Router基础概念二、条件路由实现三、基于消息头的路由四、动态路由与路由表五、消息过滤

go中空接口的具体使用

《go中空接口的具体使用》空接口是一种特殊的接口类型,它不包含任何方法,本文主要介绍了go中空接口的具体使用,具有一定的参考价值,感兴趣的可以了解一下... 目录接口-空接口1. 什么是空接口?2. 如何使用空接口?第一,第二,第三,3. 空接口几个要注意的坑坑1:坑2:坑3:接口-空接口1. 什么是空接

Spring Boot 3.4.3 基于 Spring WebFlux 实现 SSE 功能(代码示例)

《SpringBoot3.4.3基于SpringWebFlux实现SSE功能(代码示例)》SpringBoot3.4.3结合SpringWebFlux实现SSE功能,为实时数据推送提供... 目录1. SSE 简介1.1 什么是 SSE?1.2 SSE 的优点1.3 适用场景2. Spring WebFlu

基于SpringBoot实现文件秒传功能

《基于SpringBoot实现文件秒传功能》在开发Web应用时,文件上传是一个常见需求,然而,当用户需要上传大文件或相同文件多次时,会造成带宽浪费和服务器存储冗余,此时可以使用文件秒传技术通过识别重复... 目录前言文件秒传原理代码实现1. 创建项目基础结构2. 创建上传存储代码3. 创建Result类4.

SpringBoot日志配置SLF4J和Logback的方法实现

《SpringBoot日志配置SLF4J和Logback的方法实现》日志记录是不可或缺的一部分,本文主要介绍了SpringBoot日志配置SLF4J和Logback的方法实现,文中通过示例代码介绍的非... 目录一、前言二、案例一:初识日志三、案例二:使用Lombok输出日志四、案例三:配置Logback一

springboot security之前后端分离配置方式

《springbootsecurity之前后端分离配置方式》:本文主要介绍springbootsecurity之前后端分离配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的... 目录前言自定义配置认证失败自定义处理登录相关接口匿名访问前置文章总结前言spring boot secu