Html5网页页面在手机微信端共享的完成方式

日期:2021-02-27 类型:科技新闻 

关键词:网站建设,创建网站,免费建站平台,智能建站,企业建网站

手机微信共享,咋1看仿佛很繁杂,实则十分简易。只必须启用手机微信官方出的手机微信jssdk,再加一丝配备,便可以完成h5网页页面在手机微信上的共享,官方文本文档详细地址为:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

1、获得基础信息内容

寻找已有群众号的appid,依据这个appid和url向后端开发进行恳求,拿到配备所必须的主要参数:timestamp、noncestr和signature。

2、完成

1、网页页面引进JS-SDK文档

根据script标识,引进手机微信官方网站的JS-SDK文档

<script src="https://res.wx.qq.com/open/js/jweixin⑴.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('撤销了共享')
}

3、调节

wx.config里的debug字段设定为true时,便可以开展调节。

调节要用到手机微信开发设计者专用工具,挑选群众号网页页面新项目,键入网页页面详细地址便可以了。

4、遇到的难题及处理计划方案

手机微信JS-SDK表明文本文档的附录5里有绝大多数难题的处理计划方案,在这里我列出我遇到的几个上面沒有得出处理计划方案的。

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

处理:html网页页面独立引进了sdk,而且组件统1也引进了1遍sdk,致使难题,删掉在其中之1。

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

处理:同难题1。

3、invalid signature

处理:假如文本文档里的方式都沒有处理这个难题,也有1种方式,先设定1种最基本的配备,使其config ok,随后再设定1遍自身必须的有各种各样主要参数的共享创意文案,这样能绕开配备,取得成功共享。说的将会有点拗口,简易点了解便是,网页页面要是有1个config取得成功的配备,便可以再再次配备其它共享,哪怕这个共享配备的signature失效。

以上便是本文的所有內容,期待对大伙儿的学习培训有一定的协助,也期待大伙儿多多适用脚本制作之家。