很久没做移动端活动了,想不少人都参与过微信里面的活动,既然活动就少不了分享。那我就行一个前端的角度说说如何实现微信分享的吧。

对应微信分享,现在已有公共接口,微信的开发者文档SDK:https://mp.weixin.qq.com/wiki/11/74ad127cc054f6b80759c40f77ec03db.html

首先要引用官方的jweixin-1.0.0.js,然后便可启用接口,下面就以分享到微信好友,朋友圈,QQ好友,QQ空间为例

var link = window.location.href.replace('weixin-share.html','');
var shareData = {
imgUrl: link +"img/share.jpg", // 分享图标
link:link + 'weixin-share.html?inviteCode='+localStorage.inviteCode,// 分享链接
desc: '流量告急不用慌,每邀1人送1次,疯狂邀请疯狂送,流量之王就是你!',// 分享描述
title: '邀请送,500M流量疯狂送!',// 分享标题
success: function () {
if(localStorage.lastname){
alert("分享成功");
} },
cancel: function () {
// 用户取消分享后执行的回调函数
}
};
if (typeof wx != 'undefined') {
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: 'wx4601e3fa5832f936', // 必填,公众号的唯一标识
timestamp:'1472778330' , // 必填,生成签名的时间戳
nonceStr: 'HZSMK123', // 必填,生成签名的随机串
signature: 'fb0a612086e3bb8c2fb6c462c8a45722fce8409b',// 必填,后台生成,与url有关签名,见附录1
jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage','hideMenuItems','onMenuShareQQ','onMenuShareQZone'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
wx.ready(function(){
// 分享到朋友圈
wx.onMenuShareTimeline(
shareData
);
// 分享给朋友
wx.onMenuShareAppMessage(
shareData
);
// 分享到QQ
wx.onMenuShareQQ(
shareData
);
// 分享到QQ空间
wx.onMenuShareQZone(
shareData
);
// 隐藏菜单项
wx.hideMenuItems({
menuList: [
'menuItem:exposeArticle', //举报
'menuItem:setFont',
'menuItem:refresh',
'menuItem:copyUrl', //复制链接
'menuItem:originPage',
'menuItem:readMode',
'menuItem:openWithQQBrowser',
'menuItem:openWithSafari',
'menuItem:share:email'
] // 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮,所有menu项见附录3
}); });
}

说明一下appId必须是对外有效的公众号唯一id,signature必须后台生成传给前端,此时项目代码的分享功能只有放在制定(与微信绑定的)的二级域名下才可以起效

微信分享接口SDK简介使用的更多相关文章

  1. vue 项目如何使用微信分享接口

    首先做微信网页都要接入微信sdk: 安装sdk npm install weixin-js-sdk --save 具体可以查看微信公众平台技术文档:https://mp.weixin.qq.com/w ...

  2. 微信分享接口 略缩图 php

    php插件下载地址:  https://files.cnblogs.com/files/fan-bk/jssdk_php.rar 提示:如果插件里面的jssdk.php函数 file_get_cont ...

  3. Java微信分享接口开发

    发布时间:2018-11-07   技术:springboot+maven   概述 微信JS-SDK实现自定义分享功能,分享给朋友,分享到朋友圈 详细 代码下载:http://www.demodas ...

  4. 利用JS-SDK微信分享接口调用(后端.NET)

    一直都想研究一下JS-SDK微信分享的接口调用,由于最近工作需要,研究了一下,目前只是实现了部分接口的调用:其他接口调用也是类似的: 在开发之前,需要提前准备一个微信公众号,并且域名JSAPI 配置接 ...

  5. Python微信-- 分享接口(分享到朋友圈、朋友、空间)

    生成JS-SDK权限验证的签名 获取signature(签名)首先要获得 1.#获得jsapi_ticket 2.#获取当前页面的url #获取当前页面的url url="{}://{}{} ...

  6. 微信分享接口的java开发的一些小步骤

    1.配置接口信息进行验证 代码如下: /**     * 访问没认证的地址跳转     *     * @param request     * @return 登录页面     * @throws ...

  7. 微信分享网页时自定义缩略图和简介(.net版本)

    要实现微信分享网页时自定义缩略图和简介,需开发者在公众平台网站中创建公众号.获取接口权限后,通过微信JS-SDK的分享接口,来实现微信分享功能. 下面来说明实现步骤. 第一部分 准备步骤 步骤一:注册 ...

  8. VueJs单页应用实现微信网页授权及微信分享功能

    在实际开发中,无论是做PC端.WebApp端还是微信公众号等类型的项目的时候,或多或少都会涉及到微信相关的开发,最近公司项目要求实现微信网页授权,并获取微信用户基本信息的功能及微信分享的功能,现在总算 ...

  9. Android 微信分享图文资料

    上个项目做Android的微信分享,需要分享的内容有图片有文字,看了微信分享的SDK,貌似没有这个API,在网上搜了好久,总算找到解决方法了,直接上代码: public void sendReq(Co ...

随机推荐

  1. [python] Ubuntu 环境下安装 python3.5 + pip

    一般情况下先添加PPA,但是我添加PPA会报错: sudo add-apt-repository ppa:fkrull/deadsnakes ubuntu add-apt-repository: co ...

  2. java 中如何声明线程安全的集合 set, map 和list

    线程安全的集合 http://blog.sina.com.cn/s/blog_508938e10102v1ig.html //make thread-safe list List MyStrList ...

  3. iOS中的CocoaPods用法及常用命令

     CocoaPods是什么? ***CocoaPods的使用场景:*** 1. 当你开发iOS应用时,会经常使用到很多第三方开源类库,比如JSONKit,AFNetWorking等等.可能某个类库又用 ...

  4. Android之HttpURLConnection

    1.HttpURLConnection连接URL1)创建一个URL对象 URL url = new URL(); 2)利用HttpURLConnection对象从网络中获取网页数据 HttpURLCo ...

  5. Git学习(二)——创建版本库、查看与回退版本

    一.创建版本库 版本库,又名仓库(Repository),可以简单理解为一个目录,这个目录里的所有文件可以被Git管理起来,每个文件的修改.删除,Git都能跟踪,以便任何时刻都可以追踪历史,或者将来某 ...

  6. C++基础-01

    指针 - 指针的基本操作间接引用指针所指向的对象 - 机器一般按字节寻址,所以能够独立分配的最小空间是1字节,也就是说指针指向的 最小空间为1字节.特别地,对于bool变量,虽然实际需要的是1bit, ...

  7. bwa用法

    一 建立索引 比对之前,需要对fasta文件构建FM-index索引:bwa index -a bwtsw hg19.fasta 生成 hg19.fasta.amb.hg19.fasta.ann.hg ...

  8. Leetcode Elemination Game

    题目网址:https://leetcode.com/contest/2/problems/elimination-game/ 题意: 给定一个从1到n的数列,第一次从最左边开始,每隔一个淘汰一个数字. ...

  9. HTML可编辑的select

    HTML可编辑的select实现原理还是用select和input伪装成的! <!DOCTYPE html PUBLIC "-//W3C//Dth XHTML 1.0 Transiti ...

  10. Openfire 集群探究_压测情况

    一.(测试时间:20151220 - 下午14:00-17:00) windows环境 第一次测试,运行中发现在eclipse环境下.4w个连接耗尽了约1G的内存. 另外:服务本来可用的,压测客户端强 ...