当前位置: 首页 > news >正文

微信环境内H5网页,用开放标签wx-open-launch-app打开app

一、微信公众号后台配置安全域名

准备一个认证通过的公众号,打开公众号后台

1、设置与开发
2、公众号设置
3、功能设置
4、配置js接口安全域名

二、微信开放平台,将公众号与APP关联

打开微信开放平台后台

1、管理中心
2、公众号
3、选择一个需要操作的公众号点击查看
4、关联设置
5、根据提示填写关联信息(js接口安全域名需要与第一步中的域名一致)

三、开发—接入微信开放标签

引入jssdk
//1.6.0及以上
<script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js "></script>

通过后端接口拿到相关参数,通过congfig注入权限验证,需要后端配合
注意将开放标签放入openTagList 而不是 jsApiList

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

html模板放入标签

<wx-open-launch-appid="launch-btn"appid="your-appid"  //替换成你的appidextinfo="your-extinfo"
><script type="text/wxtag-template"><style>.btn { padding: 12px }</style><button class="btn">App内查看</button></script>
</wx-open-launch-app>
<script>var btn = document.getElementById('launch-btn');btn.addEventListener('launch', function (e) {console.log('success');});btn.addEventListener('error', function (e) {console.log('fail', e.detail);});
</script>

四、注意

1、真机才能生效
2、直接点击链接打开无效
3、安卓需要接入openSDK才能生效
4、小程序内web-view不支持开放标签
http://www.lryc.cn/news/394790.html

相关文章:

  • 【c++基础】高精度数不进位加法
  • UniApp 中 Web/H5 正确使用反向代理解决跨域问题
  • Redis Stream:实时数据流的处理与存储
  • 【论文阅读】-- Visual Traffic Jam Analysis Based on Trajectory Data
  • 修改编译依赖openssl的libcrypto.so
  • ����: �Ҳ������޷��������� javafx.fxml ԭ��: java.lang.ClassNotFoundException解决方法
  • 【C++】———— 继承
  • Python人生重开器
  • python 高级技巧 0708
  • HOW - React Router v6.x Feature 实践(react-router-dom)
  • `padding`、`border`、`width`、`height` 和 `display` 这些 CSS 属性的作用
  • C++ QT 全局信号的实现
  • 十款绚丽的前端 CSS 菜单导航动画
  • debain系统使用日志
  • 【Word】快速对齐目录
  • MATLAB基础应用精讲-【数模应用】 岭回归(Ridge)(附MATLAB、python和R语言代码实现)
  • 推荐6个开源博客项目源码,你会选哪个呢
  • OCR text detect
  • 【MySQL】MySQL连接池原理与简易网站数据流动是如何进行
  • 学数据结构学的很慢,毫无头绪怎么办 ?
  • VSCode常用快捷键和功能
  • 上海市计算机学会竞赛平台2023年2月月赛丙组平分数字(一)
  • Qwen1.5-1.8b部署
  • 关于7月1号centos官方停止维护7系列版本导致centos7+版本的机器yum等命令无法使用的解决教程
  • 2024人工智能大会_强化学习论坛相关记录
  • Android SurfaceFlinger——创建EGLContext(二十五)
  • python 10个自动化脚本
  • 填报高考志愿,怎样正确地选择大学专业?
  • Java 使用sql查询mongodb
  • WIN32核心编程 - 线程操作(二) 同步互斥