先來(lái)看看微信分享效果：

從策劃到設(shè)計(jì)制作，每一步都追求做到細(xì)膩，制作可持續(xù)發(fā)展的企業(yè)網(wǎng)站。為客戶提供成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作、網(wǎng)站策劃、網(wǎng)頁(yè)設(shè)計(jì)、申請(qǐng)域名、雅安服務(wù)器托管、網(wǎng)絡(luò)營(yíng)銷、VI設(shè)計(jì)、 網(wǎng)站改版、漏洞修補(bǔ)等服務(wù)。為客戶提供更好的一站式互聯(lián)網(wǎng)解決方案,以客戶的口碑塑造優(yōu)易品牌,攜手廣大客戶,共同發(fā)展進(jìn)步。

在沒(méi)有集成微信分享js-sdk前是這樣的：沒(méi)有摘要，縮略圖任意抓取正文圖片

在集成微信分享js-sdk后是這樣的：標(biāo)題，摘要，縮略圖自定義

一、下載微信SDK開(kāi)發(fā)包

下載地址：http://demo.open.weixin.qq.com/jssdk/sample.zip

二、設(shè)置安全域名

所有的微信JS接口都只能在公眾號(hào)綁定的域名下調(diào)用。登錄微信公眾平臺(tái)，點(diǎn)擊左邊的“公眾號(hào)設(shè)置”，切換到“功能設(shè)置”，在“JS接口安全域名”一欄設(shè)置安全域名，下載驗(yàn)證文件到網(wǎng)站根目錄，再回到窗口點(diǎn)擊“確定”（注：在點(diǎn)擊“確定”前，設(shè)置的域名下都要能在瀏覽器下正常訪問(wèn)剛才下載的驗(yàn)證文件才能通過(guò)驗(yàn)證）。

三、以第三方插件形式集成到ThinkPHP

1、定義第三方類庫(kù)目錄（也可以放置在TP框架默認(rèn)的插件目錄ThinkPHP/Library/Vendor/）。

在入口文件中加入define('VENDOR_PATH' APP_PATH .'Common/Vendor/');

2、在\Application\Common\Vendor文件夾下新建文件夾Wxshare，解壓微信SDK開(kāi)發(fā)包，將jssdk.PHP、access_token.php、jsapi_ticket.php復(fù)制到Wxshare，重命名jssdk.php為class.jssdk.php（符合TP加載規(guī)則的文件名）。

3、修改access_token.php、jsapi_ticket.php的讀寫(xiě)路徑。打開(kāi)class.jssdk.php文件，加入私有屬性private $filePath;

在構(gòu)造函數(shù)中設(shè)置屬性為當(dāng)前文件路徑：$this->filePath = __DIR__.'/';

搜索access_token.php、jsapi_ticket.php，在文件名前連接上$this->filePath

四、應(yīng)用

1、在公共函數(shù)庫(kù)寫(xiě)一函數(shù)方便調(diào)用

/**

* 微信分享初始化

* @return array

* @author simon

*/

if(!function_exists('wx_share_init')){

function wx_share_init(){

$wxconfig = array();

vendor('Wxshare.class#jssdk');

$config = APP_DEBUG ? C("WECHAT_SDK_TEST"): C("WECHAT_SDK");//這里配置了微信公眾號(hào)的AppId和AppSecret

$jssdk =new JSSDK($config['APPID'], $config['APPSECRET']);

$wxconfig = $jssdk->GetSignPackage();

return $wxconfig;

}

}

復(fù)制代碼

2、控制器調(diào)用

在需要做微信分享的控制器方法中調(diào)用：

$wxconfig = wx_share_init();

$this->assign('wxconfig', $wxconfig);

復(fù)制代碼

3、模板填充

在模板文件尾部加入：

wx.config({

debug:false,// 是否開(kāi)啟調(diào)試模式

appId:'',// 必填，微信號(hào)AppID

timestamp:,// 必填，生成簽名的時(shí)間戳

nonceStr:'',// 必填，生成簽名的隨機(jī)串

signature:'',// 必填，簽名，見(jiàn)附錄1

jsApiList:['onMenuShareTimeline',//分享到朋友圈

'onMenuShareAppMessage',//分享給朋友

'onMenuShareQQ'//分享到QQ

]// 必填，需要使用的JS接口列表，所有JS接口列表見(jiàn)附錄2

});

wx.ready(function(){

var options ={

title:'',// 分享標(biāo)題

link:'http://www.xxx.com/news/detail/id/',// 分享鏈接，記得使用絕對(duì)路徑

imgUrl:'http://www.xxx.com/',// 分享圖標(biāo)，記得使用絕對(duì)路徑

desc:'',// 分享描述

success:function(){

console.info('分享成功！');

// 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

},

cancel:function(){

console.info('取消分享！');

// 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

}

}

wx.onMenuShareTimeline(options);// 分享到朋友圈

wx.onMenuShareAppMessage(options);// 分享給朋友

wx.onMenuShareQQ(options);// 分享到QQ

});

復(fù)制代碼

到此完成！在微信中訪問(wèn)網(wǎng)址并分享試試看效果。

五、查閱開(kāi)發(fā)文檔

微信JS-SDK Demo地址：http://demo.open.weixin.qq.com

常見(jiàn)問(wèn)題及完整 JS-SDK 文檔地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

-----------------------------------------------------------------------------------------------------------------

補(bǔ)充一個(gè)使用場(chǎng)景：

如果是前后臺(tái)端分離的網(wǎng)站架構(gòu)（也就是通過(guò)api接口的形式），前端必然要用到ajax請(qǐng)求，會(huì)出現(xiàn)一個(gè)問(wèn)題：

被請(qǐng)求的網(wǎng)址與調(diào)用的網(wǎng)址不一致，微信SDK會(huì)提示簽名無(wú)效。提供一個(gè)解決辦法是：把調(diào)用的網(wǎng)址當(dāng)成參數(shù)發(fā)回給

}

復(fù)制代碼

2前端頁(yè)面調(diào)用：

var wxconfig =[];//定義一個(gè)全局的保存微信配置的變量

$(function(){

$.ajax({

async:false,//這里設(shè)為同步請(qǐng)求（重要）

type:'POST',

url:'/api/common/wxshareinit',//被請(qǐng)求的網(wǎng)址

data:{url:document.URL},//將當(dāng)前調(diào)用網(wǎng)址發(fā)回給服務(wù)器做簽名用

dateType:'JSON',

cache:false,

success:function(result){

wxconfig = result.data;

},

error:function(){

alert('微信分享初始化失??！');

}

});

wx.config({

debug:false,// 是否開(kāi)啟調(diào)試模式

appId: wxconfig.appId,// 必填，微信號(hào)AppID

timestamp: wxconfig.timestamp,// 必填，生成簽名的時(shí)間戳

nonceStr: wxconfig.nonceStr,// 必填，生成簽名的隨機(jī)串

signature: wxconfig.signature,// 必填，簽名，見(jiàn)附錄1

jsApiList:['onMenuShareTimeline',//分享到朋友圈

'onMenuShareAppMessage',//分享給朋友

'onMenuShareQQ'//分享到QQ

]// 必填，需要使用的JS接口列表，所有JS接口列表見(jiàn)附錄2

});

wx.ready(function(){

var options ={

title:'【有料】3號(hào)產(chǎn)品神秘體驗(yàn)，到底爽在哪？—xxx平臺(tái)',// 分享標(biāo)題

link:'http://www.xxx.com/news/detail/id/52',// 分享鏈接

imgUrl:'http://www.xxx.com/Uploads/News/2016-11/1477995152201598.jpg',// 分享圖標(biāo)

desc:'年化收益9.9%，3個(gè)月到期還本付息，起購(gòu)門(mén)檻20萬(wàn)',// 分享描述

success:function(){

console.info('分享成功！');

// 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

},

cancel:function(){

console.info('取消分享！');

// 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

}

}

wx.onMenuShareTimeline(options);// 分享到朋友圈

wx.onMenuShareAppMessage(options);// 分享給朋友

wx.onMenuShareQQ(options);// 分享到QQ

});

});