/*
*微信扫二维码分享
*/
//1、分享按钮 html
<div title="分享" ng-click="shareChartBook(chartbook)">
<i class="icon-share icon-info-propriety">
</i>
</div>
//2、检查图册是否冻结 js
$scope.shareChartBook = function(chartBook) {
if (chartBook.isFrozen) {
toaster.pop('warning', '', '图册已冻结,无法分享');
return;
}
shareManager.shareChartBook(chartBook);
}
//3、选择分享方式(公开、私密)需要与数据库交互 js
//假设公开分享
//4、选择微信分享显示二维码(二维码的内容是个链接) html
<a class="btn-share btn-share-weixin" title="分享到微信" ng-click="$('#qrcodeDiv').fadeIn('fast');"></a>
<div id="qrcodeDiv" style="">
<button type="button" class="close" ng-click="hideQRCode()" aria-hidden="true">×</button>
<label style="font-weight: bold">分享到微信</label>
<div style="padding: 15px 29px">
<qrcode version="4" error-correction-level="L" size="180" data="{{Link}}"></qrcode>
</div>
<label>使用微信扫描上面的二维码,即可分享到微信朋友圈</label>
</div>
//5、分享页面添加微信开发平台JS-SDK
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="src/js/weixin-jssdk.js"></script> //自己将JS-SDK封装成函数,所以需要引入
//5.1 封装的weixin-jssdk.js (微信开发平台 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115)
/**
*
* 需要引用下面的js来使用
* <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
*/
angular.module("weixin-jssdk", [])
.factory("WeixinSDK", ["$http", function($http) {
var ret = {};
ret.config = function(url) {
$http.get(charts_server + "/service/weixin/sign", {params: {url: url.split("#")[0]}}).success(function (response) {
if (response.object) {
var config = response.object;
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: config.appId, // 必填,公众号的唯一标识
timestamp: config.timestamp, // 必填,生成签名的时间戳
nonceStr: config.nonceStr, // 必填,生成签名的随机串
signature: config.signature,// 必填,签名
jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填,需要使用的JS接口列表
});
}
});
return ret;
};
ret.ready = function(onMenuShareTimeline, onMenuShareAppMessage) {
wx.ready(function () {
wx.onMenuShareTimeline(onMenuShareTimeline || {});
/***********************样例*********************
{
title: '哈哈哈哈哈哈?', // 分享标题
link: location.href, // 分享链接
imgUrl: local_server + '/article/first.jpg', // 分享图标
success: function() {
// 用户确认分享后执行的回调函数
},
cancel: function() {
// 用户取消分享后执行的回调函数
}
}
*************************************************/
wx.onMenuShareAppMessage(onMenuShareAppMessage || {});
/*********************样例*************************
{
title: '哈哈哈哈哈哈?', // 分享标题
desc: '哈哈哈哈哈哈?', // 分享描述
link: location.href, // 分享链接
imgUrl: local_server + '/article/first.jpg', // 分享图标
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function() {
// 用户确认分享后执行的回调函数
},
cancel: function() {
// 用户取消分享后执行的回调函数
}
}
**************************************************/
});
return ret;
};
ret.error = function(callback) {
wx.error(function (res) {
callback(res);
});
return ret;
};
return ret;
}]);
//5.2 module添加weixin-jssdk模块
var playChartBook = angular.module('playChartBook',
[
'aaa',
'bbb',
'weixin-jssdk'
]);
//5.3 controller添加WeixinSDK方法 js
playChartBook.controller('playChartBook', ['$scope','$rootScope', '$q', '$http', '$localStorage', '$modal','WeixinSDK',
function ($scope, $rootScope, $q, $http, $localStorage, $modal, WeixinSDK) {
}
//6、调用方法,添加微信分享到朋友圈和好友时的图片、摘要和标题
//微信分享标题、摘要和图片
var weixinName = obj.resource.name;
var weixinDesc = (obj.resource.desc == "" || !obj.resource.desc) ? "这是标题" : obj.resource.desc;
var weixinImage = (obj.resource.iconStore.substring(0,4) == "http") ? obj.resource.iconStore : charts_server + '/service/image?path=' + obj.resource.iconStore;
WeixinSDK.config(location.href)
.ready({
title: weixinName, // 分享标题
link: location.href.split('#')[0], // 分享链接
imgUrl: weixinImage, // 分享图标
success: function() {
},
cancel: function() {
}
}, {
title: weixinName, // 分享标题
desc: weixinDesc, // 分享描述
link: location.href.split('#')[0], // 分享链接
imgUrl: weixinImage, // 分享图标
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function() {
},
cancel: function() {
}
});
网站添加微信分享功能
猜你喜欢
转载自blog.csdn.net/taotao12312/article/details/76999452
今日推荐
周排行