微信公众号跳转微信小程序，自定义微信跳转标签_opentaglist-程序员宅基地

引入微信自带的js脚本

https://res.wx.qq.com/open/js/jweixin-1.6.0.js

配置wx.config,并且增加openTagList开放标签列表（wx-open-launch-weapp）

wx.config({
                  debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                  appId: '', // 必填，公众号的唯一标识
                  timestamp: result.timestamp, // 必填，生成签名的时间戳
                  nonceStr: result.noncestr, // 必填，生成签名的随机串
                  signature: result.signature,// 必填，签名
                  jsApiList: ['chooseImage', 'previewImage'], // 必填，需要使用的JS接口列表
                  openTagList: ['wx-open-launch-weapp'] // 可选，需要使用的开放标签列表
                });

wx-open-launch-weapp标签的使用

<wx-open-launch-weapp
		          id="launch-btn"
		          username="gh_xxxxxxxx" 
		          path="需要跳转小程序的路径"
		    >
		    <template>
		      <button class="button" style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">跳转</button> 
		    </template>
		  </wx-open-launch-weapp>

使用详情请参考官方文档

后端获取签名参数详情接口请参考微信开发文档的附录1-JS-SDK使用权限签名算法

注意事项：

1、只能跳转发布的小程序，不能跳转体验版和开发版

2、公众号只能是认证的非个人主体的服务号，不能是订阅号

3、微信公众号中必须配置js安全域名，并且安全域名必须开放80端口，否则不能成功添加js安全域名，配置了js安全域名才能访问JS接口

4、如果不能正常获取accessToken，请在微信公众号官网配置白名单

全部前端的demo代码如下

<html>
  <head>
    <title>跳转小程序</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.4.1/weui.min.css"></link>
    <script typet="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <style>
    </style>
  </head>
  <body>
	<!-- display: flex; align-items: center;" -->
    <div id="wechat-web-container" style="width: 100%;height: 100vh;">
    </div>
    <script type="text/javascript">
	
	
      $(document).ready(function(){
          function dff(){
            $.ajax({
              url: '后端根据获取签名的接口',
			  dataType : "jsonp",（解决跨域的问题，后端返回callback + "("+返回的json字符串+")"）
			  data: {url: location.href.split('#')[0]},
              type: 'GET',
			  jsonp : "callback",
              success:function(result){
				console.info('result',result);
                wx.config({
                  debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                  appId: '', // 必填，公众号的唯一标识
                  timestamp: result.timestamp, // 必填，生成签名的时间戳
                  nonceStr: result.noncestr, // 必填，生成签名的随机串
                  signature: result.signature,// 必填，签名
                  jsApiList: ['chooseImage', 'previewImage'], // 必填，需要使用的JS接口列表
                  openTagList: ['wx-open-launch-weapp'] // 可选，需要使用的开放标签列表
                });
            },
			 error:function(e) {
				 console.info(e)
			 }});
          }
          dff();
		  
		  //获取浏览器地址的参数
		  function getQueryVariable() {
		    let href = window.location.href
		  	console.info('href',href)
		    let query = href.substring(href.indexOf('?') + 1);
		  	console.info('query',query)
		    let vars = query.split("&");
		    let obj = {}
		    for (var i = 0; i < vars.length; i++) {
		      let pair = vars[i].split("=");
		      obj[pair[0]] = pair[1]
		    }
		    return obj;
		  }
		  var querys = getQueryVariable();
		  console.info("querys",querys)
		  var path = querys.path ? decodeURIComponent(querys.path) : 跳转小程序的路径，可以动态传参数
		  console.info("path",path)
		  var username = ''//username小程序原始id
		  //  replace username
          //给id=wechat-web-container增加标签
		  $('#wechat-web-container').append(`
		    <wx-open-launch-weapp
		          id="launch-btn"
		          username="${username}" 
		          path="${path}"
		    >
		    <template>
		      <button class="button" style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">跳转</button> 
		    </template>
		  </wx-open-launch-weapp>`)
		  
		  // alert(path)
 
          wx.ready(function () {
              console.log('config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中')
 
              var btn = document.getElementById('launch-btn');
              btn.addEventListener('launch', function (e) {
                console.log('success');
                alert('success')
              });
              btn.addEventListener('error', function (e) {
                console.log('fail', e.detail);
                alert('fail', e.detail)
                // alert('fail', e.detail)
              });
          });
      });
    </script>
	<style>
	.button {
		position:absolute;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
	}
	</style>
  </body>
</html>

本文链接：https://blog.csdn.net/weixin_45256333/article/details/127324192

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

settext 下划线_Android TextView 添加下划线的几种方式-程序员宅基地

文章浏览阅读748次。总结起来大概有5种做法：将要处理的文字写到一个资源文件，如string.xml(使用html用法格式化)当文字中出现URL、E-mail、电话号码等的时候，可以将TextView的android:autoLink属性设置为相应的的值，如果是所有的类型都出来就是**android:autoLink="all"，当然也可以在java代码里做,textView01.setAutoLinkMask(Li..._qaction::settext 无法添加下划线

TableStore时序数据存储 - 架构篇_tablestore 时间类型处理-程序员宅基地

文章浏览阅读6.3k次，点赞2次，收藏10次。摘要：背景随着近几年物联网的发展，时序数据迎来了一个不小的爆发。从DB-Engines上近两年的数据库类型增长趋势来看，时序数据库的增长是非常迅猛的。在去年我花了比较长的时间去了解了一些开源时序数据库，写了一个系列的文章（综述、HBase系、Cassandra系、InfluxDB、Prometheus），感兴趣的可以浏览。背景随着近几年物联网的发展，时序数据迎来了一个不小的爆发。从DB..._tablestore 时间类型处理

Ubuntu20.04下成功运行VINS-mono_uabntu20.04安装vins-mono-程序员宅基地

文章浏览阅读5.7k次，点赞8次，收藏49次。可以编译成功但是运行时段错误查找原因应该是ROS noetic版本中自带的OpenCV4和VINS-mono中需要使用的OpenCV3冲突的问题。为了便于查找问题，我只先编译feature_tracker包。解决思路历程：o想着把OpenCV4相关的库移除掉，但是发现编译feature_tracker的时候仍然会关联到Opencv4的库，查找原因是因为cv_bridge是依赖opencv4的，这样导致同时使用了opencv3和opencv4,因此运行出现段错误。oo进一步想着（1）把vins-mon_uabntu20.04安装vins-mono

TMS320C6748_EMIF时钟配置_tms 6748-程序员宅基地

文章浏览阅读3.6k次，点赞3次，收藏12次。创龙TL6748开发板中，EMIFA模块使用默认的PLL0_SYSCLK3时钟，使用AISgen for D800K008工具加载C6748配置文件C6748AISgen_456M_config（Configuration files，在TL_TMS6748/images文件夹下），由图可以看到DIV3等于4，注意这里的DIV3就是实际的分频值（x），而不是写入相应PLL寄存器的值（x-1）。_tms 6748

eigen稀疏矩阵拼接（基于块操作的二维拼接）的思考-程序员宅基地

文章浏览阅读5.9k次，点赞4次，收藏13次。转载请说明出处：eigen稀疏矩阵拼接（块操作）eigen稀疏矩阵拼接（块操作）关于稀疏矩阵的块操作：参考官方链接 However, for performance reasons, writing to a sub-sparse-matrix is much more limited, and currently only contiguous sets of columns..._稀疏矩阵拼接

基于Capon和信号子空间的变形算法实现波束形成附matlab代码-程序员宅基地

文章浏览阅读946次，点赞19次，收藏19次。波束形成是天线阵列信号处理中的一项关键技术，它通过对来自不同方向的信号进行加权求和，来增强特定方向的信号并抑制其他方向的干扰。本文介绍了两种基于 Capon 和信号子空间的变形算法，即最小方差无失真响应 (MVDR) 算法和最小范数算法，用于实现波束形成。这些算法通过优化波束形成权重向量，来最小化波束形成输出的方差或范数，从而提高波束形成性能。引言波束形成在雷达、声纳、通信和医学成像等众多应用中至关重要。它可以增强目标信号，抑制干扰和噪声，提高系统性能。