APPID公众号id、申请好友分享接口、ip白名单、js接口安全域名设置(必须是通过备案)。要先登录微信公众平台进入“公众号设置”的功能设置里填写“JS接口域名”
注意:支持使用AMD/CMD标准加载方法
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需要调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushShate的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题在Android6.2修复)
wx.config({ debug: true, //开启调试模式,调用所有的api的返回值会在客户端alert出来,若要查看传入的参数,可以在PC端打印出来 appId: '', //必填,公账号的唯一标识 timestamp: '', //必填,生成签名的时间戳 nonceStr: '', //必填,生成签名的随机串 signature: '', //必填,签名 jsApiList: [ //必填,需要使用js列表,否则无法分享成功 'onMenuShareTimeline', //朋友圈 'onMenuShareAppMessage', //朋友 'onMenuShareQQ', //QQ 'onMenuShareWeibo', //QQ空间 ]})
wx.ready(function(){ //config信息验证后会执行ready方法,所有接口调用必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中});
wx.error({ //config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名});
var data = { title: '', summary: '', pic: '', url: '', success: function(){ getWeixin() ;//用户确认分享后执行的回调函数 }, cancel: function(){ //用户取消分享后执行的回调函数 }} wx.config({ swapTitleInWX: true, appId: "<?php echo $weixin_package['appid'];?>", timestamp: "<?php echo $weixin_package['timestamp'];?>", nonceStr: "<?php echo $weixin_package['noncestr'];?>", signature: "<?php echo $weixin_package['signature'];?>", jsApiList: [ 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', ]}) wx.ready(function () { wx.onMenuShareTimeline(data); wx.onMenuShareAppMessage(data); wx.onMenuShareQQ(data) wx.onMenuShareWeibo(data)})
注意点:
title,建议在14个字以内图片尺寸: 300*300像素;图片格式:大小不超过10kB,不支持GIF格式;会取当前页面body内最前面的一张符合条件的图片对标题简要解读,建议20字以内link:'', //分享链接,改链接域名或路径必须与当前页面对应的公账号JS安全域名一致QQ是通过head里面的标签来识别分享的图标和标题,涉及到h5微数据的一个属性itemprop,
<meta itemprop="name" content="标题"/><meta itemprop="description" name="description" content="描述"/>
在js中的应用:获取完数据后自定义分享
/*QQ分享*/
var shareName = '分享标题';
var shareDesc= '分享描述';
var sharePic= '分享图片路径';
var metaStr = '<meta itemprop="name" content="'+shareName+'"/><meta name="description" itemprop="description" content="'+shareDesc+'"/><meta itemprop="image" content="'+sharePic+'"/>';
$('head').append(metaStr);
$('title').html(shareName);
在实际开发中,我们需要知道当前的浏览器是微信内置的浏览器,那么如何判断呢?以下提示了四种方法,每一种都可以进行判断是否是微信浏览器。
实现思路是,引入cookie功能,创建一个存储访客微信用户信息的cookie。当用户首次访问时,通过oauth授权获取用户信息,并存储于cookie中。当用户再次访问时,判断是否有相应cookie来调取用户信息,这样就不会触发二次授权。
跟大家分享一段微信支付的js代码片段、V3版的微信支付没有paySignKey参数、基本上是直接复制就可以使用了、改一改自己的参数就好了
在做微信公众平台网页授权时,发现每次请求授权链接时都会重定向链接redirect_uri都会自动请求两次,由于并发导致了一些问题,那么,为什么会请求两次呢?,调试时发现会访问两次,一次是301,页面重定向了,第二次跟第一次就差这个参数connect_redirect=1
在我们做营销活动或推广宣传的时候,容易遇到域名被封,无法跳转app下载等情况。这时需要微信跳转外部浏览器打开页面的功能,目前ios只能通过遮罩层来提示用户,对于安卓可以直接跳转外面默认浏览器
首先大家为了取得一个良好的名次是可以理解的,但是需要合理的去操作,为什么这么说呢,如果你找到一个不负责的商家不给你控量,或者胡乱操作,往往无得其反,因小失大就不好,所以投票这个还是需要找一个专业的团队
由于微信限制比较严格,域名一不小心就被判定是诱导分享的。所以,公司内部决定调研一套稳定、快速、正确率高的微信域名拦截检测查询接口。开发组尝试谷歌搜索了一段时间,发现很少把源码及原理分享出来的。后来我们摸索了几天
本篇主要讲述,如何在微信中打开自家的页面,在然后在用户分享的时候,能由我们自定义分享出去后,展示的页面卡片中的页面标题、页面描述、页面图片和分享链接。
由于项目中使用了vue,使用了gulp和普通的页面跳转。并没有引入vue-router。所以不能使用 watch监控$router。微信公众号ios点击后退按钮,优选读取缓存,所以vue里的生命周期不会在进行调用。所以项目中执行隐藏分享qq,空间。等功能不被再次执行。
最近在做一个项目需求,分享领好书活动,获取用户的个人信息以及unionID,并诱导用户分享给好友或朋友圈,达到裂变拉新的目的。在做的过程中遇到了一些坑的地方,所以回过来总结一下
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!