移动端微信分享_移动端微信是啥-程序员宅基地

技术标签: 微信  分享  

微信分享,咋一看好像很复杂,实则非常简单。只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在微信上的分享,官方文档地址为:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

一、获取基本信息
找到已有公众号的appid,根据这个appid和url向后端发起请求,拿到配置所需要的参数:timestamp、noncestr和signature。

二、实现
1、页面引入JS-SDK文件
通过script标签,引入微信官网的JS-SDK文件
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript"></script>
2、基本配置
wx.config({
    debug: false, // 是否开启调试模式
    appId: appid, //appid
    timestamp: timestamp, // 时间戳
    nonceStr: noncestr, // 随机字符串
    signature: signature, // 签名
    jsApiList: [
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'onMenuShareQZone'
    ] // 需要使用的JS接口列表
})

3、使用
wx.ready(function(){
    // 分享给好友
    wx.onMenuShareAppMessage({
        title: title, // 分享标题
        desc: desc, // 分享描述
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
            doShareDone()
        },
        cancel: function () {
            doShareCancel()
        }
    })

// 分享到朋友圈
    wx.onMenuShareTimeline({
        title: title, // 分享标题
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
            doShareDone()
        },
        cancel: function () {
            doShareCancel()
        }
    })
})

// 分享成功回调
function doShareDone () {
    console.log('分享成功')
}

// 取消分享回调
function doShareCancel () {
    console.log('取消了分享')
}

三、调试
wx.config里的debug字段设置为true时,就可以进行调试。

调试要用到微信开发者工具,选择公众号网页项目,输入页面地址就可以了。

四、遇到的问题及解决方案
微信JS-SDK说明文档的附录5里有大部分问题的解决方案,在这里我列出我遇到的几个上面没有给出解决方案的。

1、Uncaught TypeError: Cannot read property 'config' of undefined

解决:html页面单独引入了sdk,并且组件统一也引入了一遍sdk,导致问题,删除其中之一。

2、Uncaught (in promise) TypeError: Cannot read property 'ready' of undefined

解决:同问题1。

3、invalid signature

解决:如果文档里的方法都没有解决这个问题,还有一种方法,先设置一种最基础的配置,使其config ok,然后再设置一遍自己需要的有各种参数的分享文案,这样能绕过配置,成功分享。说的可能有点拗口,简单点理解就是,页面只要有一个config成功的配置,就可以再继续配置其它分享,哪怕这个分享配置的signature无效。
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/xuehu837769474/article/details/82459470

智能推荐

迄今为止最强大的开源 LLM,15 万亿 Token 预训练的 LLaMA3 强势来袭_如何解决llama3 token长度问题-程序员宅基地

文章浏览阅读607次,点赞19次,收藏18次。例如,虽然 8B 参数模型在 Chinchilla 的最佳训练计算量对应于约 200B 个Token,但我们发现,即使在模型训练完成之后,再接受了两个数量级以上的数据训练,模型性能仍在继续提高。此版本是在 15 万亿个 Token 上预训练的语言模型,具有 8B 和 70B 两种参数规模,可以支持广泛的用户场景,在各种行业基准上取得了最先进的性能,并提供一些了新功能,包括改进的推理能力,这些都是同时期最好的开源模型。此外,还进行了广泛的实验,以评估在最终预训练数据集中混合不同来源的数据的最佳方法。_如何解决llama3 token长度问题

svn命令使用总结_svn删除文件夹命令-程序员宅基地

文章浏览阅读347次。Ubuntu安装svnapt-get install subversiongit工具使用ubuntu 18.04下svn的安装与基本命令_svn删除文件夹命令

Linux 机器间配置 SSH 免密登录_从linux服务器上ssh连接其他主机免输密码-程序员宅基地

文章浏览阅读1.4k次。在日常工作中,服务器常常会有多台。特别是应用服务器存在多台的情况下,在每台机器手动部署或升级服务,每次登录多台机器特别麻烦,通过一台机器跳转每次输入密码(一般都是超强密码)也麻烦。所以说配置机器间的免密,对日常工作来说可以简化操作流程,节省宝贵时间。这篇就简单说说如何配置多台机器间的免密功能。_从linux服务器上ssh连接其他主机免输密码

python预测值和真实值_机器学习中用什么图可以表示预测数据与真实数据的差异?...-程序员宅基地

文章浏览阅读2.5k次。但是实际上学习机器学习可能很困难。您要么使用行为类似于“黑匣子”的预构建包,要么在其中传递数据,另一端则产生魔力,或者您必须处理高级数学和线性代数。每种方法都使学习机器学习充满挑战和威胁。用Python搭建机器学习模型预测房租价格旨在向您介绍机器学习的基本概念。在继续学习时,您将从头开始构建第一个模型以进行预测,同时准确地了解模型的工作原理。(用Python搭建机器学习模型预测房租价格基于我们的机..._python机器学习预测数据比较作图

端口扫描--zmap-程序员宅基地

文章浏览阅读1k次。ZMap被设计用来针对整个IPv4地址空间或其中的大部分实施综合扫描的工具。ZMap是研究者手中的利器,但在运行ZMap时,请注意,您很有 可能正在以每秒140万个包的速度扫描整个IPv4地址空间 。我们建议用户即使在实施小范围扫描之前,也联系一下本地网络的管理员并参考我们列举的最佳扫描体验。默认情况下,ZMap会对于指定端口实施尽可能大速率的TCP SYN扫描。较为保守的情况下,对..._zmap输出结果带端口

uva1587BOX-程序员宅基地

文章浏览阅读114次。uva1587BOX 给定6个矩形的长和宽wi和hi(1≤wi,hi≤1000),判断它们能否构成长方体的6个面。思路是首先排序,每个矩形都是x<y,就是短边x,长边y,然后对六个矩形进行二级排序,排序以后构成长方体的条件有两步,第一步,首先是三对相同的长..._给定6个矩形的长和宽w和h(l≤w,h≤1000),判断它们能否构成长方

随便推点

单指令周期CPU---转移指令的实现_指令jal执行后下一条指令的地址为多-程序员宅基地

文章浏览阅读1.1w次,点赞6次,收藏37次。单周期MIPS_指令jal执行后下一条指令的地址为多

Java解析XML_java 解析xml-程序员宅基地

文章浏览阅读1k次,点赞17次,收藏23次。XML现在已经成为一种通用的数据交换格式,平台的无关性使得很多场合都需要用到XML。本文将详细介绍用Java解析XML的四种方法在做一般的XML数据交换过程中,我更乐意传递XML字符串,而不是格式化的XML Document。这就涉及到XML字符串和Xml Document的转换问题,说白了这是个很简单的问题,本文就各种XML解析器分别列举如下,以方便自己今后查阅。=========..._java 解析xml

【AI视野·今日NLP 自然语言处理论文速览 第二十期】Thu, 8 Jul 2021_自然语言处理最新论文-程序员宅基地

文章浏览阅读301次。AI视野·今日CS.NLP 自然语言处理论文速览Thu, 8 Jul 2021Totally 25 papers????上期速览更多精彩请移步主页Daily Computation and Language PapersDORA: Toward Policy Optimization for Task-oriented Dialogue System with Efficient Context Authors Hyunmin Jeon, Gary Geunbae Lee最近,通过_自然语言处理最新论文

Delphi XE 取得当前时间戳的几个函数_delphi时间戳-程序员宅基地

文章浏览阅读501次,点赞11次,收藏9次。时间戳 delphi_delphi时间戳

bugfix之Parameter is not valid for operation xxx. Parameter is [req]. Processor is [body].-程序员宅基地

文章浏览阅读1k次。对比发现是没有加构造方法,加上注解@NoArgsConstructor 和。@AllArgsConstructor之后解决。_parameter is not valid for operation

Qt键盘事件:捕获和处理用户输入_qt 捕获键盘输入-程序员宅基地

文章浏览阅读397次。通过使用类似的方法,您可以根据自己的需求在Qt应用程序中捕获和处理键盘事件。键盘事件的处理为用户提供了更多的交互性和灵活性,使得Qt应用程序更加强大和易用。在main函数中,我们创建了一个QApplication对象和一个MyWidget对象,并显示了MyWidget窗口。函数会被调用,并传递一个QKeyEvent对象作为参数,该对象包含了有关键盘事件的详细信息,如按下的键码、修饰键状态等。在上面的示例中,我们创建了一个自定义的QWidget派生类MyWidget,并重写了它的。_qt 捕获键盘输入

推荐文章

热门文章

相关标签