uniapp H5 JSSDK封装使用

朱雀 2022-12-20 05:35 321阅读 0赞

先看效果吧，

封装以后使用很方便，两行代码就能得到微信网页开发中的 jssdk 的 wx.config 执行了 wx.ready 还是 wx.error ，如果返回 true 就标识执行了ready ， 可以调用JSSDK的 API 了，如下图示例代码：

this.$common.Init.call(this);
    this.wxjssdkInti().then(rr => {
    	console.log('jssdk初始化成功', rr)
    	wx.getLocation({
    		type: 'wgs84', 
    		success: function (res) {
    			var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
    			var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
    		}
    	});
    })

![2020111018022171.png][]

封装的目录结构代码：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NzEzNzUy_size_16_color_FFFFFF_t_70][]

wxJsSdk.js 代码：这里面引用的 config ，api ， requset 可以

[2020111018022171.png]: /images/20221120/f5da9c84c7744b76995838ebb4ca5632.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NzEzNzUy_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20201110175520382.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NzEzNzUy,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，321人围观）

还没有评论，来说两句吧...

相关阅读

相关【uniapp】H5向uniapp通信存储数据——H5如何传递数据到uniapp方法的解决方案

最近在做H5号码认证无感登录，发现市场上的H5登录文档不健全，没有适合uniapp的，综合对比了多家，找了一家个推的接入，由于SDK、demo都是H5，精力有限，于是打算...

柔光的暖阳◎/ 2024年04月20日 22:30/ 0 赞/ 81 阅读

相关 H5调用微信JSSDK开发总结

最近需要开发一个小项目，他的一个需求为：能够在微信中分享（转发好友以及朋友圈），而且要求图片和标题摘要等内容自定义。本着试一试的态度，我用手机访问自己搭建在服务器上的IP地址，

悠悠/ 2023年07月04日 15:46/ 0 赞/ 44 阅读

相关 uniapp兼容H5和小程序订阅消息授权开发封装，使用方便

本文使用 uniapp 框架开发，因为H5的订阅消息和小程序的订阅消息的授权流程不一样，但是很多地方需要使用授权，所以我封装了一个兼容H5和小程序订阅消息授权的方法，使用比较方

ゝ一纸荒年。/ 2022年12月20日 12:54/ 0 赞/ 276 阅读

相关 uniapp H5 JSSDK封装使用

先看效果吧，封装以后使用很方便，两行代码就能得到微信网页开发中的 jssdk 的 wx.config 执行了 wx.ready 还是 wx.error ，如果返回 true

朱雀/ 2022年12月20日 05:35/ 0 赞/ 322 阅读

相关 uniapp h5微信分享

安装微信sdk npm install jweixin-module --save var jweixin = require('jweixin-modul

落日映苍穹つ/ 2022年09月11日 11:19/ 0 赞/ 287 阅读

相关 uniapp 开发的H5 微信公众jssdk验签 invalid signature的问题

1. 根据微信jssdk文档说明配置传当前访问的url给后端 2. [验签地址][Link 1] https://mp.weixin.qq.com/debug/cgi-b

清疚/ 2022年09月10日 01:26/ 0 赞/ 250 阅读

相关 uni-app 开发微信公众号（H5）JSSDK 的使用方式

因为这个jssdk被uni-app坑了好多天，作者说支持1.4版本，但是我用1.4的两个分享的新方法一直不支持。 ![在这里插入图片描述][watermark_type_Zm

╰+哭是因爲堅強的太久メ/ 2022年04月25日 02:20/ 0 赞/ 207 阅读

相关 uniapp实战——完成h5打包

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

阳光穿透心脏的1/2处/ 2021年07月25日 16:58/ 0 赞/ 889 阅读

相关 uniapp h5打包发布

1、在项目的manifest.json中 h5配置,配置页面标题即可 2、hbuilderX中点击发行网站-H5手机版 3、在打包后的文件夹中，命令行输入打开

缺乏、安全感/ 2021年07月24日 12:59/ 0 赞/ 707 阅读

相关 uniapp接口封装和使用

新建util文件夹，当前目录下新建api.js，代码为下 const BASE_URL = 'http://192.168.110.188:8001' /

- 日理万妓/ 2021年07月24日 12:03/ 0 赞/ 596 阅读