JSSDK实现微信分享功能上海迅速网络

13916016158

关注迅速公众平台

关注微信联系人

企业电话：021-64391578

JSSDK实现微信分享功能

$(function(){
var appId = '公众号的appid';
var imgURL = '自定义分享时的图片地址';
var link = '分享页面的链接地址';
var desc = '定义分享的内容';
var title = '定义分享的标题';

weixinShareTimeline();
weixinShareFriend();

//分享到朋友圈
function weixinShareTimeline(){
WeixinJSBridge.invoke('shareTimeline',{
'img_url':ingURL,
'link':link,
'desc':desc,
'title':title
});
}

//发送给好友
function weixinShareFriend(){
WeixinJSBridge.invoke('sendAppMessage',{
'appid':appId,
'img_url':imgURL,
'link':link,
'desc':desc,
'title':title
});
}
};

提示：这是分享接口的官方新文档链接： https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
利用微信JSSDK实现分享时回调不成功：

1、分享的title和url不正确：

title的值 = 当前页中标签<title>定义的内容

url是当前页面的 url = location.href

desc可以自定义分享的内容

2、分享到朋友圈之后，不回调：

如果link，imgUrl的域名不是公众号填写的安全域名，则会忽略你自定义分享的内容，即一些提示信息都正常，但是不显示你自定义

的信息，也不回调success

3、无法自定义分享按钮，可以自定义分享的内容，但是分享入口还是微信默认的分享入口，即微信右上角菜单分享按钮并且不能引导用户去分享

下面详细介绍使用微信JSSDK实现分享的功能：

1、登录微信公众平台，绑定域名

2、在shake_redbag.php页面引入jweixin.js插件

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
3、定义jssdk.php，封装PHP类进行权限验证
<?php
class JSSDK {
private $appId;
private $appSecret;

public function __construct($appId, $appSecret) {
$this->appId = $appId;
$this->appSecret = $appSecret;
}

public function getSignPackage() {
$jsapiTicket = $this->getJsApiTicket();
$url = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$timestamp = time();
$nonceStr = $this->createNonceStr();

// 这里参数的顺序要按照 key 值 ASCII 码升序排序

$string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";

$signature = sha1($string);

$signPackage = array(
"appId" => $this->appId,
"nonceStr" => $nonceStr,
"timestamp" => $timestamp,
"url" => $url,
"signature" => $signature,
"rawString" => $string
);
return $signPackage;
}

private function createNonceStr($length = 16) {
$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
$str = "";
for ($i = 0; $i < $length; $i++) {
$str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
}
return $str;
}

private function getJsApiTicket() {
// jsapi_ticket 应该全局存储与更新，以下代码以写入到文件中做示例
$data = json_decode(file_get_contents("jsapi_ticket.json"));
if ($data->expire_time < time()) {
$accessToken = $this->getAccessToken();
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
$res = json_decode($this->httpGet($url));
$ticket = $res->ticket;
if ($ticket) {
$data->expire_time = time() + 7000;
$data->jsapi_ticket = $ticket;
$fp = fopen("jsapi_ticket.json", "w");
fwrite($fp, json_encode($data));
fclose($fp);
}
} else {
$ticket = $data->jsapi_ticket;
}

return $ticket;
}

private function getAccessToken() {
// access_token 应该全局存储与更新，以下代码以写入到文件中做示例

$data = json_decode(file_get_contents("access_token.json"));
if ($data->expire_time < time()) {
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this->appId&secret=$this->appSecret";
$res = json_decode($this->httpGet($url));
$access_token = $res->access_token;
if ($access_token) {
$data->expire_time = time() + 7000;
$data->access_token = $access_token;
$fp = fopen("access_token.json", "w");
fwrite($fp, json_encode($data));
fclose($fp);
}
} else {
$access_token = $data->access_token;
}
return $access_token;
}

private function httpGet($url) {
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_TIMEOUT, 500);
curl_setopt($curl, CURLOPT_URL, $url);

$res = curl_exec($curl);
curl_close($curl);

return $res;
}
}
4、在shake_redbag.php文件（这个文件包括php，html，js）起始处调用类

<?php
require_once "jssdk.class.php";
require_once "../../../config.php"; //这个文件定义了appID appSecret
$jssdk = new JSSDK("appID", "appSecret"); //红色部分在公众平台开发->基本配置中获取
$signPackage = $jssdk->GetSignPackage();
?>

5、通过config接口注入权限验证配置，通过error接口处理失败验证，

<script>
// 注意：所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
// 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
// 完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '<?php echo $signPackage["appId"];?>',
timestamp: <?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
// 所有要调用的 API 都要加到这个列表中
'onMenuShareTimeline',
'onMenuShareAppMessage'
]
});

wx.error(function(res){
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
alert("error:"+JSON.stringify(res));
});
//config信息验证完之后，会自动调用ready()函数，如果需要在页面加载时机调用接口，就得把相关接口放在ready函数里面，来确保正确执行
wx.ready(function () {
setShare(); //定义函数
});
function setShare(){
// 在这里调用 API，分享朋友圈
wx.onMenuShareTimeline({
title: shareTitle, // 分享标题
link: shareLink, // 分享链接
desc:shareDesc,
imgUrl: shareImgUrl, // 分享显示的缩略图
success: function () {
// 用户确认分享后执行的回调函数
// alert('分享完成');
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert('淘气了哦，你取消分享');
},fail: function (res) {
alert(JSON.stringify(res));
}
});
//分享给朋友
wx.onMenuShareAppMessage({
title: shareTitle, // 分享标题
link: shareLink, // 分享链接
desc:shareDesc,
imgUrl: shareImgUrl, // 分享显示的缩略图
success: function () {
// 用户确认分享后执行的回调函数
// alert('分享完成');
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert('淘气了哦，你取消分享');
},fail: function (res) {
alert(JSON.stringify(res));
}
});
}
</script>

以下是shake_redbag.php和shake_redbag.js文件的完整内容

1、shake_redbag.php

<?php
require_once "js/jssdk.php";
require_once "../../../config.php";
$jssdk = new JSSDK($AppID, $AppSecret); //红色部分在公众平台开发->基本配置中获取
$signPackage = $jssdk->GetSignPackage();
?>
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title id="title">欢乐上墙</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet" />
<link href="css/shake_redbag.css" rel="stylesheet" type="text/css">
<script src="http://i.gtimg.cn/qzone/biz/gdt/lib/jquery/jquery-2.1.4.js?max_age=31536000"></script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.1.6/ZeroClipboard.min.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script type="text/javascript" src="../../config.js"></script>
<script type="text/javascript" src="../../common/js/common.js"></script>

<script type="text/javascript" src="js/shake_redbag.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

</head>

<body>
<script type="text/javascript">

var activity_id = "96"; //新用于测试1-92 新的一天-86 测试3-97
// var activity_id = '86';
// var openid = 'oLXpo0lL3R2h-sXbGERPM9ufJzF0'; //--测试用的微信openid
var openid = 'oLXpo0l6qKgYo18f5Q04ZkOEOA3Y';
var activity_title = "欢乐上墙"; //用于获取活动标题，显示在红包信息的标题
var current_redbag; //--存储当前红包
var redbags; //--存储红包列表
var time_distance = 0;//本地时间和服务器时间的差本地时间和服务器时间的差值
var price = 0; // 存储抢到红包的金额
var totalFee = 0; //抢到红包的总额
var numMax = 30; //摇一摇的目标次数,上线的时候要改成100

var shareTitle = "";
var shareDesc = "";
var shareLink = document.location.href;
var shareImgUrl = globalConfig.pre_web_url+"/front/common/image/logo.jpg";
//定义分享的内容的变量
shareDesc = '欢乐上墙是一款简单、好玩的场景互动平台，可以实现大屏幕微信互动、让现场更加亲切';

// 非测试环境则改变这些参数
if (isTestEnv == false) {
activity_id = getUrlParam("activity_id");
openid = getUrlParam("openid");
activity_title = getUrlParam("title");
numMax = 3;
}
</script>

<div class="shareCss" id="countdown">
<p id='countdownTxt'>摇红包倒计时</p>
<p id='timeContent'></p>
<p class="copyAndSend">点击下方:复制链接，发送好友</p>
<p class="copyAndSend">邀好友帮你抢红包</p>
<img src="img/downArrow.png" class="downArrow">
<p id="clipBoardTxt">复制链接，发送好友</p>
</div>

<div id="shake_view">
<h3 class="top">摇一摇</h3>
<div class="circleprogress" id="circleprogress">
<div class="shake_pic" id="shake_pic">
<img src="img/hand.png" id="shake_icon" />
</div>
</div>
<div class="times">
<p>目标次数:<span id='target_number'></span>次
<br/>
<span>已摇</span><span id="numberCount">0</span>次
</p>
</div>
</div>

<div class="shareCss" id="redBagInfo">
<h3 id='hostName'></h3>
<p>恭喜你</p>
<p id="fee"></p>
<p id="closePage">进入公众号领取 ></p>
</div>

<div class="shareCss" id="nextRedBagActivity">
<p id="promst"></p>
<p>下一轮抢红包活动</p>
<p id="entry">进入 ></p>
</div>

<div class="shareCss" id="activityEnd">
<p id="endActivityPageTxt"></p>
<p>抢红包活动已经结束</p>
<p id="checkRedBagRecord">查看红包记录 ></p>
</div>

<div class="shareCss" id="noData">
<p>暂无红包活动</p>
</div>

<div class="shareCss" id="redbagRecordPage">
<p id="recordInfoTitle">您的红包记录</p>
<ul>

</ul>
<p class="shareToFriend">摇红包示范视频</p>
<video id="shakeVideo" src='video/shakingRedbagVideo.mp4' autoplay="autoplay" controls="controls" style="background:url(img/shaking_bg.jpg);" webkit-playsinline playsinline></video>
<p class="shareToFriend">分享给身边的好友</p>
<p class="shareToFriend">参与他的活动</p>
<p class="shareToFriend">就有机会抢红包</p>
<img src="../../common/image/server_logo.jpg" class="qrCodeImg" />
<br />
<p id='qrcodeTxt'>长按二维码，关注欢乐上墙</p>
</div>

<div class="shareCss" id="noRushRedbag">
<p>很遗憾</p>
<p>您一个红包都没有抢到</p>
</div>

<audio src="mp3/shakingAudio.mp3" preload="preload" id="shakingAudio"></audio>

<audio src="mp3/shakingResult.mp3" preload="preload" id="shakingResult"></audio>
</body>

<script>

// 注意：所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
// 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
// 完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '<?php echo $signPackage["appId"];?>',
timestamp: <?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
// 所有要调用的 API 都要加到这个列表中
'onMenuShareTimeline',
'onMenuShareAppMessage'
]
});

wx.error(function(res){
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
alert("error:"+JSON.stringify(res));

});

wx.ready(function () {

setShare();
});

document.addEventListener("WeixinJSBridgeReady", function () {
document.getElementById('shakeVideo').play();
}, false);

</script>

</html>

2、shake_redbag.js
$(function() {
var SHAKE_THRESHOLD = 1800;
var last_update = 0;
var x = y = z = last_x = last_y = last_z = 0;
var num = 0;
var shake_status = 0; //0:未开始，1：正在进行 2：已结束
// var times = 0;
// var activity_id = sessionStorage.getItem("activity_id"); //上线的时候要改成这个样式
var price = 0;

// 验证参数的合法性
var flag = isParamValidate(activity_id, '请先点击活动界面的”设置“按钮');
if (flag == false) { return; }

console.log("activity_id:"+activity_id);
// 添加摇一摇的目标次数
$('#target_number').text(numMax);
// 请求红包列表，并对数据进行处理
requestRedbags(activity_id);

// 点击“进入”按钮，刷新界面，进入下一轮抢红包活动
$('#entry').click(function(){
// 刷新界面
location.reload();
});

// 点击“查看红包记录”，刷新界面，查看抢到的红包信息
$('#checkRedBagRecord').click(function(){
// 刷新界面
location.reload();
});

// 抢到红包，则关闭浏览器界面
$('#closePage').click(function(){
WeixinJSBridge.invoke('closeWindow',{});
});

// 点击复制链接，发送好友，实现将当前页url放到剪贴板上，并关闭当前页，引导用户发送给好友
$('#clipBoardTxt').click(function(){
// 要复制的url
var clipBoardCont = location.href;
var clip = new ZeroClipboard($('#clipBoardTxt'));
clip.setText(clipBoardCont);
// window.clipboardData.setData('Text',clipBoardCont); //只有IE支持这种写法
success_prompt_alert('复制成功');
setTimeout(function(){
// 关闭当前浏览器页面
WeixinJSBridge.invoke('closeWindow',{});
},2000);

});

// 设置视频自动播放,dom节点，play()是element方法
// $('video')[0].play();
// WebView webView = this.finishActivity(R.id.main_act_webview);
// if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
// webView.getSettings().setMediaPlaybackRequiresUserGesture(false);
// }

// 测试时用的，上线时要删掉
var shake_count = 0;
function monitor_shake(){
setTimeout(function(){
shake_count ++ ;
document.getElementById("numberCount").innerHTML = shake_count;

if (shake_count < numMax) {
monitor_shake();
$('#shakingAudio').trigger('play');
}else if(shake_count == numMax){
$('#shakingResult').trigger('play');
drawRedbag(openid);
}
}, 1000);
}
// --检测设备是否有摇一摇动作
function deviceMotionHandler(eventData) {
var acceleration = eventData.accelerationIncludingGravity;
var curTime = new Date().getTime();
shake_status = 1;
if ((curTime - last_update) > 100) {
var diffTime = curTime - last_update;
last_update = curTime;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;

if (speed > SHAKE_THRESHOLD) {
// times++;
handelShakingMotion();
}
last_x = x;
last_y = y;
last_z = z;
}
}

// 设备有摇一摇动作，则对页面已摇次数进行加1，若已经摇到最大次数numMax，则请求抢红包接口
function handelShakingMotion() {
if (shake_status == 2 || shake_status == 0) {
return false;
}
num++;
// 添加摇一摇的声音
$('#shakingAudio').trigger('play');
document.getElementById("numberCount").innerHTML = num;
// setTimeout(function() {
// times = 0;
if (num == numMax) {
num = 0;
shake_status = 2;
// 关闭摇一摇的接口
window.removeEventListener("devicemotion", deviceMotionHandler);
// 添加摇到红包的声音
$('#shakingResult').trigger('play');
// 摇一摇结束之后，请求抢红包接口
drawRedbag(openid);
}
// }, 100); //测试得知80是比较理想的数值
}

// 模拟抽中红包的效果
function monitorDrawedRedbag(){
var Display = document.getElementById("redpacket");
var show = document.getElementById("redpacket_open");
var close = document.getElementById("close");
var param = {"opendid":openId};
close.style.display = "block";
Display.style.display = "block";
Display.style.width = "300px";
Display.style.height = "450px";
Display.style.top = "100px";
Display.style.left = "50%";
Display.style.margin = "0px -150px 0px -150px";
show.style.width = "100px";
show.style.height = "100px";
show.style.marginTop = "-50px";
show.style.marginLeft = "100px";
show.style.fontSize = "25px";
show.style.border = "1px solid #FFA73A";
show.style.background = "#FFA73A";
}

// 发送抢红包请求
function drawRedbag(openid){
console.log("drawRedbag");
var url = globalConfig.pre_api_url + "/wxwall_api/redbag/draw_redbag.php";
var param = {
"openid":openid
};
request(url,param,function(response){
// 请求抢红包接口成功
var redBagData = response.data;
// $('#shakingResult').trigger('play');
price = redBagData.price;
refreshView(current_redbag,true);
console.log(response.msg);
});

}

// 抢红包进行中，监听摇一摇的动作
function listenPhoneShake() {
if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler,false);
console.log("addEventListener devicemotion");
} else {
alert('抱歉，你的手机配置实在有些过不去，考虑换个新的再来试试吧');
}
}

// 当前红包：刷新界面
function refreshView(redbag,is_show_redbag){
// 显示没有红包
if( redbag === undefined ){
$('#shake_view').hide();
$('#countdown').hide();
$('#redBagInfo').hide();
$('#nextRedBagActivity').hide();
$('#activityEnd').hide();
$('#redbagRecordPage').hide();
$('#noRushRedbag').hide();
$('#noData').show();
return;
}
// 有红包，但都已经无效了
if (redbag === null) {
$('#shake_view').hide();
$('#countdown').hide();
$('#redBagInfo').hide();
$('#nextRedBagActivity').hide();
$('#activityEnd').hide();
$('#noData').hide();
// 显示红包记录/或者没有抢到红包
getRedbagRecord();
// $('#redbagRecordPage').show();
return;
}

var status = redbag.status;
if (status == '0') {
//显示倒计时
$("#shake_view").hide();
$('#redBagInfo').hide();
$('#nextRedBagActivity').hide();
$('#activityEnd').hide();
$("#countdown").show();
}else if (status == '1'){
if (is_show_redbag == true) {
$('#hostName').text( activity_title + "的红包" );
$('#fee').text('成功抢到' + price +'元');
$('#shake_view').hide();
$('#nextRedBagActivity').hide();
$('#activityEnd').hide();
$("#countdown").hide();
$('#redBagInfo').show();
return;
}else{
//显示摇一摇
$("#countdown").hide();
$('#redBagInfo').hide();
$('#nextRedBagActivity').hide();
$('#activityEnd').hide();
$('#redBagInfo').hide();
$("#shake_view").show();
}

}else if(status == '2'){
// 判断是否还有下一轮红包，在用户没有抢到红包的情况下，
// 有下一轮红包就显示进入下一轮，没有的话就显示活动结束
// 当用户抢到红包，就不会进入这种情况
var nextRedbag = getAvailableRedbag();
if (nextRedbag == null) {
//若无，显示已经结束；.......
$('#redBagInfo').hide();
$("#shake_view").hide();
$("#countdown").hide();
$('#nextRedBagActivity').hide();
if( price == 0 ){
$('#endActivityPageTxt').text('很可惜，您没抢到红包');
}else{
$('#endActivityPageTxt').text('成功抢到' + price + '元');
}
$('#activityEnd').show();
}else{
//若有，显示还有下一轮......
$('#redBagInfo').hide();
$("#countdown").hide();
$('#activityEnd').hide();
$("#shake_view").hide();
if( price == 0 ){
$('#promst').text('很可惜，您没抢到红包');
}else{
$('#promst').text('成功抢到' + price + '元');
}
$('#nextRedBagActivity').show();
}
}
}

// 获取当前有效的红包
function getAvailableRedbag(){
var length = redbags.length;
// 没有红包活动返回null
if (length == 0) {
return null;
}
// 遍历红包列表，取到第一个有效的红包，若有则返回当前有效的红包
for(var i = 0; i < length; i++){
var redbag = redbags[i];
var status = redbag.status;
// 主要获取到第一个有效的红包就返回当前有效的红包，并且退出该函数
if (status != '2') {
return redbag;
break;
}
}
// 没有有效的红包，即所有的红包活动都结束了
return null;
}
// 开始摇红包倒计时
function startCount(startTime) {
// var timeContent = $('#timeContent'); //显示倒计时的框
var endTime = new Date(startTime.replace(/-/g,'/')); //红包开始的时间
var countTimer = setInterval(
function() {
var nowTime = new Date();
var time = endTime.getTime() - nowTime.getTime() + time_distance; //截止时间和开始时间相差的毫秒数
if (!isNaN(time) && time >= 0) {
var day = parseInt(time / 1000 / 60 / 60 / 24);
var hour = parseInt(time / 1000 / 60 / 60 % 24);
var minute = parseInt(time / 1000 / 60 % 60);
var second = parseInt(time / 1000 % 60);
if (time == 0) {
current_redbag.status = "1";
refreshView(current_redbag,false);
}else if (time <= 10000) {
// 调用10秒倒计时动画
$('#timeContent').text( second + '秒' );
} else if (time <= 120000) {
// 倒数120秒的时候
var secondLeft = minute * 60 + second;
$('#timeContent').text( secondLeft + '秒');
} else {
$('#timeContent').text( day + '天' + hour + '小时' + minute + '分钟' + second + '秒');
}
} else if (time < 0) {
clearInterval(countTimer);
}
}, 1000
);
}
// 检查红包状态变化的长轮询
function check_redbag_status(redBagId,oldStatus,timeOut,startTime) {
var url = globalConfig.pre_api_url + "/wxwall_api/redbag/check_redbag_status.php"; //检查红包状态的url
var redbag_id = redBagId;
var old_status = oldStatus;
var time_out = timeOut;
var start_time = startTime;
var param = {
"redbag_id": redbag_id,
"old_status": old_status,
"time_out": time_out
};
$.ajax({
// 提交数据的类型
type: "POST",
// 提交的网址
url: url,
// 提交的数据
data: param,
// 返回数据的格式
datatype: "json",
// 在请求之前调用的函数
beforeSend: function() {
},
// 成功返回之后调用的函数
success: function(response) {
response = eval("(" + response + ")");
var status = response.status;
if (status == '2') {
current_redbag.status = response.data.new_status;//很重要
handleRedbag(current_redbag);
if (current_redbag.status == '2') {
return;
}
}
check_redbag_status(redbag_id,current_redbag.status,time_out,start_time);
// console.log(response.msg);
},
// 执行后调用的函数
complete: function(XMLHttpRequest, textStatus) {
// console.log(textStatus);
},
// 调用出错执行的函数
error: function() {
console.log("error");
setTimeout(function(){
check_redbag_status(redbag_id,old_status,time_out,start_time);
}, 500); //这里是500ms吗？？失败后果500ms再次请求
},
});
}
// 请求红包列表
function requestRedbags(activity_id){
var get_redbag_list_url = globalConfig.pre_api_url + "/wxwall_api/redbag/get_redbag_list.php"; //获取红包列表的url
data = {
"activity_id": activity_id,
};
// 向后台请求红包列表，并根据每个红包的status进行相应的处理
request(get_redbag_list_url, data, function(response) {
var datas = response.data;
redbags = datas.redbags;
// 当没有红包活动的时候，提示没有红包
if( datas == '' || response.status == '6'){
refreshView(undefined,false);
return;
}
// redbag 存储当前有效的红包或者null
var redbag = getAvailableRedbag();
// 当有红包活动的时候，但是没有有效红包，显示抢到红包的信息
if( redbag === null ){
refreshView(null,false);
return;
}
var servie_time = new Date(datas.current_time.replace(/-/g,'/')); //卸载下面，防止datas=‘’的时候，replace()函数出错
var local_time = new Date();
time_distance = local_time.getTime() - servie_time.getTime(); //服务器和用户的时间相差的毫秒数
// 获取红包列表
var length = redbags.length;
var redbag_id = redbag.id;
var old_status = redbag.status;
var start_time = redbag.start_time;
var time_out = 40;
current_redbag = redbag;
// 处理当前的红包
handleRedbag(redbag);
// 长轮询检测status
check_redbag_status(redbag_id,old_status,time_out,start_time);
});
}
// 处理当前有效的红包
function handleRedbag(redbag){
var status = redbag.status;
var start_time = redbag.start_time;
//
refreshView(redbag,false);
// $("#device_log").append("<li>status:"+status+"<li>");

if (status == '0') {
//显示倒计时
startCount(start_time);
}else if(status == '1'){
//监听摇一摇
if (isTestEnv == true) {
monitor_shake();
}else{
listenPhoneShake();
}

}else if(status == '2'){
// refreshView()函数已经处理了
//结束该轮抢红包，进入了结束界面

//关闭用户可以摇红包的能力

//提示用户是否还有下一轮红包活动，如果有，则引导用户操作；如果没有，提示没有。
}
}

// 获取抢到红包的记录
function getRedbagRecord(){
var url = globalConfig.pre_api_url + "/wxwall_api/redbag/get_redbag_records.php"; //获取抢到红包的记录
var data = {
"activity_id":activity_id,
"openid":openid,
};
// 请求抢到红包记录
request(url,data,function(response){
if( response.data == '' || response.status == '6'){
// 显示没有抢到红包的界面
$('#noRushRedbag').show();
$('#redbagRecordPage').hide();
return;
}
var datas = response.data;
var len = datas.length;
for(var i = 0;i < len;i++){
var data = datas[i];
var money = data.price;
var title = data.title;
var redbagRecordList = '<li>'+
'<span class="recordTitle">' + title + '</span>'+
'<span class="recordMoney">' + money + ' 元</span>'+
'</li>';
$('ul').append(redbagRecordList);
// 计算抢到红包的总额，用于分享时用
totalFee = parseFloat(totalFee) + parseFloat(money);
shareTitle = "我在《" + activity_title + "》抽到" + totalFee + "元红包";
$("#title").html(shareTitle);
setShare();
if(i == len -1){
// 显示红包记录界面
$('#redbagRecordPage').show();
$('#noRushRedbag').hide();
}
}

});
}

function setShare(){
// 在这里调用 API
wx.onMenuShareTimeline({
title: shareTitle, // 分享标题
link: shareLink, // 分享链接
desc:shareDesc,
imgUrl: shareImgUrl, // 分享显示的缩略图
success: function () {
// 用户确认分享后执行的回调函数
// alert('分享完成');
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert('淘气了哦，你取消分享');
},fail: function (res) {
alert(JSON.stringify(res));
}
});

wx.onMenuShareAppMessage({
title: shareTitle, // 分享标题
link: shareLink, // 分享链接
desc:shareDesc,
imgUrl: shareImgUrl, // 分享显示的缩略图
success: function () {
// 用户确认分享后执行的回调函数
// alert('分享完成');
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert('淘气了哦，你取消分享');
},fail: function (res) {
alert(JSON.stringify(res));
&n