js分享功能源碼,javascript源碼分享網站

本文目錄一覽：

• 1、不使用微信開發平台 怎麼用js寫分享內容
• 2、如何在網頁中通過js代碼將內容分享到朋友圈？
• 3、如何在網頁中通過js代碼將內容分享到朋友圈
• 4、如何使用微信JS-SDK實際分享功能
• 5、h5頁面通過js實現分享朋友圈，請問怎麼實現，或者說能不能實現？

不使用微信開發平台 怎麼用js寫分享內容

為了凈化網絡，整頓誘導分享及誘導關注行為，微信於2014年12月30日發布了《微信公眾平台關於整頓誘導分享及誘導關注行為的公告》，微信平台開發者發現，原有的微信分享功能不能用了，在iphone手機上，顯示為當前頁的鏈接，之前設置的圖標和標題等都沒有了。雖然在部分android手機上還可以用，但最近微信升級後，分享功能也不正常了。正在苦於微信分享該怎麼解決時，微信於2015年1月10日即時發布了開放JS-SDK，為微信網站的開發提供了強大的js功能。這裡僅就分享功能的使用進行一些描述。

下面的代碼，服務器端使用的是php。

步驟1 生成簽名

登錄你的微信平台，點擊“公眾號設置”。

點擊“功能設置”，然後點擊“設置”。

設置JS接口安全域名。這裡填寫的是一級域名，不帶www和http。最多可以設置三個域名。設置完後點擊確定。（多說一句，相比以前的分享沒有任何域名限制，這裡設置安全域名，目的是為了當發現此公眾平台發現誘導分享行為時，可以根據此域名追溯到所有分享出去的鏈接，以及通過這些鏈接增加的粉絲。這樣，微信就可以牢牢控制了你的微信平台，一旦發現違規，讓分享鏈接失效，刪除掉誘導行為增加的粉絲，是瞬間就可以完成的。因此，微信平台的開發者，一定要合理來使用分享功能，不要因小失大。等到你的微信平台被封，估計哭都來不及）

在開發者中心中獲取你的AppID和AppSecret，接下來在獲取令牌時，需要這兩個信息。

獲取令牌。在服務器端完成，代碼如下：

function wx_get_token() {

$token = S(‘access_token’);

if (!$token) {

$res = file_get_contents(‘;appid=’ .’你的AppID’.’secret=’ .’你的AppSecret’);

$res = json_decode($res, true);

$token = $res[‘access_token’];

// 注意：這裡需要將獲取到的token緩存起來（或寫到數據庫中）

// 不能頻繁的訪問，每日有次數限制

// 通過此接口返回的token的有效期目前為2小時。令牌失效後，JS-SDK也就不能用了。

// 因此，這裡將token值緩存1小時，比2小時小。緩存失效後，再從接口獲取新的token，這樣

// 就可以避免token失效。

// S()是ThinkPhp的緩存函數，如果使用的是不ThinkPhp框架，可以使用你的緩存函數，或使用數據庫來保存。

S(‘access_token’, $token, 3600);

}

return $token;

}

注意：返回的access_token長度至少要留夠512字節。接口返回值：

{“access_token”:”ACCESS_TOKEN”,”expires_in”:7200}

{“access_token”:”vdlThyTfyB0N5eMoi3n_aMFMKPuwkE0MgyGf_0h0fpzL8p_hsdUX8VGxz5oSXuq5dM69lxP9wBwN9Yzg-0kVHY33BykRC0YXZZZ-WdxEic4″,”expires_in”:7200}

獲取jsapi的ticket。jsapi_ticket是公眾號用於調用微信JS接口的臨時票據。正常情況下，jsapi_ticket的有效期為7200秒，通過access_token來獲取。

function wx_get_jsapi_ticket(){

$ticket = “”;

do{

$ticket = S(‘wx_ticket’);

if (!empty($ticket)) {

break;

}

$token = S(‘access_token’);

if (empty($token)){

wx_get_token();

}

$token = S(‘access_token’);

if (empty($token)) {

logErr(“get access token error.”);

break;

}

$url2 = sprintf(“;type=jsapi”,

$token);

$res = file_get_contents($url2);

$res = json_decode($res, true);

$ticket = $res[‘ticket’];

// 注意：這裡需要將獲取到的ticket緩存起來（或寫到數據庫中）

// ticket和token一樣，不能頻繁的訪問接口來獲取，在每次獲取後，我們把它保存起來。

S(‘wx_ticket’, $ticket, 3600);

}while(0);

return $ticket;

}

接口返回值：

{“errcode”:0,”errmsg”:”ok”,”ticket”:”sM4AOVdWfPE4DxkXGEs8VMKv7FMCPm-I98-klC6SO3Q3AwzxqljYWtzTCxIH9hDOXZCo9cgfHI6kwbe_YWtOQg”,”expires_in”:7200}

簽名，將jsapi_ticket、noncestr、timestamp、分享的url按字母順序連接起來，進行sha1簽名。

noncestr是你設置的任意字符串。

timestamp為時間戳。

$timestamp = time();

$wxnonceStr = “任意字符串”;

$wxticket = wx_get_jsapi_ticket();

$wxOri = sprintf(“jsapi_ticket=%snoncestr=%stimestamp=%surl=%s”,

$wxticket, $wxnonceStr, $timestamp,

‘要分享的url(從http開始，如果有參數，包含參數）’

);

$wxSha1 = sha1($wxOri);

如何在網頁中通過js代碼將內容分享到朋友圈？

布驟一：綁定域名

先登錄微信公眾平台進入“公眾號設置”的“功能設置”里填寫“JS接口安全域名”。

備註：登錄後可在“開發者中心”查看對應的接口權限。

步驟二：引入JS文件

在需要調用JS接口的頁面引入如下JS文件

步驟三：通過config接口注入權限驗證配置

所有需要使用JS-SDK的頁面必須先注入配置信息，否則將無法調用（同一個url僅需調用一次，對於變化url的SPA的web app可在每次url變化時進行調用,目前Android微信客戶端不支持pushState的H5新特性，所以使用pushState來實現web app的頁面會導致簽名失敗，此問題會在Android6.2中修復）。

步驟四：通過ready接口處理成功驗證

wx.ready(function(){ // config信息驗證後會執行ready方法，所有接口調用都必須在config接口獲得結果之後，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中。});

驟五：通過error接口處理失敗驗證

wx.error(function(res){// config信息驗證失敗會執行error函數，如簽名過期導致驗證失敗，具體錯誤信息可以打開config的debug模式查看，也可以在返回的res參數中查看，對於SPA可以在這裡更新簽名。

接口調用說明

所有接口通過wx對象(也可使用jWeixin對象)來調用，參數是一個對象，除了每個接口本身需要傳的參數之外，還有以下通用參數：

success：接口調用成功時執行的回調函數。

fail：接口調用失敗時執行的回調函數。

complete：接口調用完成時執行的回調函數，無論成功或失敗都會執行。

cancel：用戶點擊取消時的回調函數，僅部分有用戶取消操作的api才會用到。

trigger: 監聽Menu中的按鈕點擊時觸發的方法，該方法僅支持Menu中的相關接口。

備註：不要嘗試在trigger中使用ajax異步請求修改本次分享的內容，因為客戶端分享操作是一個同步操作，這時候使用ajax的回包會還沒有返回

以上幾個函數都帶有一個參數，類型為對象，其中除了每個接口本身返回的數據之外，還有一個通用屬性errMsg，其值格式如下：

調用成功時：”xxx:ok” ，其中xxx為調用的接口名

用戶取消時：”xxx:cancel”，其中xxx為調用的接口名

調用失敗時：其值為具體錯誤信息

基礎接口判斷當前客戶端版本是否支持指定JS接口

wx.checkJsApi({ jsApiList: [‘chooseImage’], // 需要檢測的JS接口列表，所有JS接口列表見附錄2, success: function(res) {// 以鍵值對的形式返回，可用的api值true，不可用為false // 如：{“checkResult”:{“chooseImage”:true},”errMsg”:”checkJsApi:ok”}  }});

如何在網頁中通過js代碼將內容分享到朋友圈

登錄你的微信平台，點擊“公眾號設置”。

2

點擊“功能設置”，然後點擊“設置”。

3

設置JS接口安全域名。這裡填寫的是一級域名，不帶www和http。最多可以設置三個域名。設置完後點擊確定。（多說一句，相比以前的分享沒有任何域名限制，這裡設置安全域名，目的是為了當發現此公眾平台發現誘導分享行為時，可以根據此域名追溯到所有分享出去的鏈接，以及通過這些鏈接增加的粉絲。這樣，微信就可以牢牢控制了你的微信平台，一旦發現違規，讓分享鏈接失效，刪除掉誘導行為增加的粉絲，是瞬間就可以完成的。因此，微信平台的開發者，一定要合理來使用分享功能，不要因小失大。等到你的微信平台被封，估計哭都來不及）

4

在開發者中心中獲取你的AppID和AppSecret，接下來在獲取令牌時，需要這兩個信息。

5

獲取令牌。在服務器端完成，代碼如下：

function wx_get_token() {

$token = S(‘access_token’);

if (!$token) {

$res = file_get_contents(‘;appid=’ .’你的AppID’.’secret=’ .’你的AppSecret’);

$res = json_decode($res, true);

$token = $res[‘access_token’];

// 注意：這裡需要將獲取到的token緩存起來（或寫到數據庫中）

// 不能頻繁的訪問，每日有次數限制

// 通過此接口返回的token的有效期目前為2小時。令牌失效後，JS-SDK也就不能用了。

// 因此，這裡將token值緩存1小時，比2小時小。緩存失效後，再從接口獲取新的token，這樣

// 就可以避免token失效。

// S()是ThinkPhp的緩存函數，如果使用的是不ThinkPhp框架，可以使用你的緩存函數，或使用數據庫來保存。

S(‘access_token’, $token, 3600);

}

return $token;

}

注意：返回的access_token長度至少要留夠512字節。接口返回值：

{“access_token”:”ACCESS_TOKEN”,”expires_in”:7200}

{“access_token”:”vdlThyTfyB0N5eMoi3n_aMFMKPuwkE0MgyGf_0h0fpzL8p_hsdUX8VGxz5oSXuq5dM69lxP9wBwN9Yzg-0kVHY33BykRC0YXZZZ-WdxEic4″,”expires_in”:7200}

6

獲取jsapi的ticket。jsapi_ticket是公眾號用於調用微信JS接口的臨時票據。正常情況下，jsapi_ticket的有效期為7200秒，通過access_token來獲取。

function wx_get_jsapi_ticket(){

$ticket = “”;

do{

$ticket = S(‘wx_ticket’);

if (!empty($ticket)) {

break;

}

$token = S(‘access_token’);

if (empty($token)){

wx_get_token();

}

$token = S(‘access_token’);

if (empty($token)) {

logErr(“get access token error.”);

break;

}

$url2 = sprintf(“;type=jsapi”,

$token);

$res = file_get_contents($url2);

$res = json_decode($res, true);

$ticket = $res[‘ticket’];

// 注意：這裡需要將獲取到的ticket緩存起來（或寫到數據庫中）

// ticket和token一樣，不能頻繁的訪問接口來獲取，在每次獲取後，我們把它保存起來。

S(‘wx_ticket’, $ticket, 3600);

}while(0);

return $ticket;

}

接口返回值：

{“errcode”:0,”errmsg”:”ok”,”ticket”:”sM4AOVdWfPE4DxkXGEs8VMKv7FMCPm-I98-klC6SO3Q3AwzxqljYWtzTCxIH9hDOXZCo9cgfHI6kwbe_YWtOQg”,”expires_in”:7200}

7

簽名，將jsapi_ticket、noncestr、timestamp、分享的url按字母順序連接起來，進行sha1簽名。

noncestr是你設置的任意字符串。

timestamp為時間戳。

$timestamp = time();

$wxnonceStr = “任意字符串”;

$wxticket = wx_get_jsapi_ticket();

$wxOri = sprintf(“jsapi_ticket=%snoncestr=%s×tamp=%surl=%s”,

$wxticket, $wxnonceStr, $timestamp,

‘要分享的url(從http開始，如果有參數，包含參數）’

);

$wxSha1 = sha1($wxOri);

END

步驟2 添加JS代碼

生成簽名後，就可以使用js代碼了。在你的html中，進行如下設置即可。

script type=”text/javascript” src=””/script

script type=”text/javascript”

// 微信配置

wx.config({

debug: false,

appId: “你的AppID”,

timestamp: ‘上一步生成的時間戳’,

nonceStr: ‘上一步中的字符串’,

signature: ‘上一步生成的簽名’,

jsApiList: [‘onMenuShareTimeline’, ‘onMenuShareAppMessage’] // 功能列表，我們要使用JS-SDK的什麼功能

});

// config信息驗證後會執行ready方法，所有接口調用都必須在config接口獲得結果之後，config是一個客戶端的異步操作，所以如果需要在 頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則可以直接調用，不需要放在ready 函數中。

wx.ready(function(){

// 獲取“分享到朋友圈”按鈕點擊狀態及自定義分享內容接口

wx.onMenuShareTimeline({

title: ‘分享標題’, // 分享標題

link:”分享的url,以http或https開頭”,

imgUrl: “分享圖標的url,以http或https開頭” // 分享圖標

});

// 獲取“分享給朋友”按鈕點擊狀態及自定義分享內容接口

wx.onMenuShareAppMessage({

title: ‘分享標題’, // 分享標題

desc: “分享描述”, // 分享描述

link:”分享的url,以http或https開頭”,

imgUrl: “分享圖標的url,以http或https開頭”, // 分享圖標

type: ‘link’, // 分享類型,music、video或link，不填默認為link

});

});

/script

如何使用微信JS-SDK實際分享功能

方法步驟：這裡說說流程，具體每一步的操作可以參見百度

1登錄微信平台，點擊“公眾號設置”

2點擊“功能設置”，然後點擊“設置”。

3設置JS接口安全域名。填寫的是一級域名，不帶www和http。最多可以設置三個域名。設置完後點擊確定。

4在開發者中心中獲取AppID和AppSecret，接下來在獲取令牌時，需要這兩個信息。

5獲取令牌。在服務器端完成，

6獲取jsapi的ticket。jsapi_ticket是公眾號用於調用微信JS接口的臨時票據。正常情況下，jsapi_ticket的有效期為7200秒，通過access_token來獲取。

7簽名，將jsapi_ticket、noncestr、timestamp、分享的url按字母順序連接起來，進行sha1簽名。

8.添加JS代碼，

h5頁面通過js實現分享朋友圈，請問怎麼實現，或者說能不能實現？

分享功能需要對接接口，不同的平台需要不同的KEY，需要註冊為開發者才能獲取KEY。

分享按鈕不一定非要自己寫，可以通過第三方的如百度分享實現。

如果你的H5是通過第三方那種模塊式操作的話，裡面一般都自帶分享功能。

自己寫的話，百度分享是最快捷的了。