微信開發:微信js_sdk分享,使用場景,網頁在微信app內部分享時的標題與描述,包括logo設置(一)


主要有下面幾步。首先大家先分清楚 小程序的appid,appSecret 跟公眾號的appid,appSecret是不一樣的。因為這兩個都能拿到token,且是不同的值。

准備開始:

1.准備好 公眾號的appid ,appSecret .

2.在微信后台設置js 安全接口域名。可以添加三個,大家自己找下。或者百度。

環境介紹,我這里用的是TP5 框架,有用到Cache類

第一步:根據appid,appSecret 獲取access_token,這里,我們給說明下,access_token 有效期是7200s (2個小時);

這里直接貼出獲取的函數。方便大家看懂。這里,httpRequest() 函數是一個curl操作。

function gettoken($data){
    $appId = $data['appid'];
    $appSecret = $data['appSecret'];
    $url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".$appId."&secret=".$appSecret;
    return $result=httpRequest($url,'GET');
}
/**
 * CURL請求
 * @param $url 請求url地址
 * @param $method 請求方法 get post
 * @param null $postfields post數據數組
 * @param array $headers 請求header信息
 * @return mixed
 */
function httpRequest($url, $method, $postfields = null, $headers = array(), $debug = false) {
    $method = strtoupper($method);
    $ci = curl_init();
    /* Curl settings */
    curl_setopt($ci, CURLOPT_HTTP_VERSION, CURL_HTTP_VERSION_1_0);
    curl_setopt($ci, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows NT 6.2; WOW64; rv:34.0) Gecko/20100101 Firefox/34.0");
    curl_setopt($ci, CURLOPT_CONNECTTIMEOUT, 60); /* 在發起連接前等待的時間,如果設置為0,則無限等待 */
    curl_setopt($ci, CURLOPT_TIMEOUT, 7); /* 設置cURL允許執行的最長秒數 */
    curl_setopt($ci, CURLOPT_RETURNTRANSFER, true);
    switch ($method) {
        case "POST":
            curl_setopt($ci, CURLOPT_POST, true);
            if (!empty($postfields)) {
                $tmpdatastr = is_array($postfields) ? http_build_query($postfields) : $postfields;
                curl_setopt($ci, CURLOPT_POSTFIELDS, $tmpdatastr);
            }
            break;
        default:
            curl_setopt($ci, CURLOPT_CUSTOMREQUEST, $method); 
            break;
    }
    $ssl = preg_match('/^https:\/\//i',$url) ? TRUE : FALSE;
    curl_setopt($ci, CURLOPT_URL, $url);
    if($ssl){
        curl_setopt($ci, CURLOPT_SSL_VERIFYPEER, FALSE); // https請求 不驗證證書和hosts
        curl_setopt($ci, CURLOPT_SSL_VERIFYHOST, FALSE); 
    }
    //curl_setopt($ci, CURLOPT_FOLLOWLOCATION, 1);
    curl_setopt($ci, CURLOPT_MAXREDIRS, 2);/*指定最多的HTTP重定向的數量,這個選項是和CURLOPT_FOLLOWLOCATION一起使用的*/
    curl_setopt($ci, CURLOPT_HTTPHEADER, $headers);
    curl_setopt($ci, CURLINFO_HEADER_OUT, true);
    $response = curl_exec($ci);
    $requestinfo = curl_getinfo($ci);
    $http_code = curl_getinfo($ci, CURLINFO_HTTP_CODE);
    curl_close($ci);
    return $response;
    //return array($http_code, $response,$requestinfo);
}
View Code

第二部: 根據token 獲取getticket ,jsapi數據,這里為了不使得大家迷糊,貼完整的代碼。看不懂的部分,可以自行查閱資料。根據返回值,我們有做時間的處理。

防止重復調用token 和 getticket 。代碼里面有說明。

獲取到的 getticket  信息,需要根據errcode 狀態來判斷。

下面是源碼部分,展開列表,你就能看到豐富的代碼。

public function indexdemo(){
        //通過接口去拿token的值。
        $data['appid']="wx0c38278aa06f63dd";//這里的appid已經修改為假的,請大家替換
        $data['appSecret']="29cb76731d9f0d6c2e364190a1ad117c";//請替換
        $token=Cache::get('token');
        if(empty($token)){//token不存在,請求
             $token=gettoken($data);
             $strtoken=json_decode($token,true);
             $strtoken['expires_in']=$strtoken['expires_in']-10;//這里做10s的兼容處理。
             //設置access_token 緩存,跟有效期。           
             Cache::set('token',$strtoken['access_token'],$strtoken['expires_in']);
             $token=$strtoken['access_token'];
              
        } 
        //根據token 獲取getticket ,jsapi數據
        $urling="https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=".$token."&type=jsapi";

        $ticket=Cache::get('ticket');

        if(empty($ticket)){//為空,獲取ticket 
            $result=file_get_contents($urling);
            $result=json_decode($result,true);
            //返回結果成功,緩存ticket
            if($result['errcode']=='0'){
                $result['expires_in']=$result['expires_in']-10;//10s 兼容處理
                Cache::set('ticket',$result['ticket'],$result['expires_in']);
                $ticket=$result['ticket'];
            }
        }
        
       $jsapi_ticket=$ticket; 
       
       //生成隨機的nonceStr 
       $noncestr = $this->createNonceStr();

       $protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
       $url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
       $timestamp = time();
       //按照字典序列組裝字符串,並sha1加密。
       $string1 = "jsapi_ticket={$jsapi_ticket}&noncestr={$noncestr}&timestamp={$timestamp}&url={$url}";
       $signature = sha1($string1);    
       
       $signPackage = array(        
            'appId'     => $data['appid'],        
            'nonceStr'  => $noncestr,        
            'timestamp' => $timestamp,        
            'signature' => $signature,
        );
       //返回數據給前端
        $this->assign('signPackage',json_encode($signPackage,true));
        // $this->assign('signPackage',$signPackage);
        return $this->fetch();
    }
View Code

 

 調試出要的字段,然后進行var_dump()輸出測試。如圖,正常顯示。

 

第三部:使用php語法,輸出數據到前端js里面,js里面做配置即可。這里使用的是微信開發者工具,公眾號模式。其實也可以在自己的編輯器里面用的。看到這里,

后續就可以根據微信的文檔來操作,前端的分享頁面了。

 

1.關於遇到的坑分析:appid 無效,config:配置失敗。

這里我們需要效驗signature 簽名是不是跟微信一致。

我們可以先生成自己的signature,然后使用微信開發工具生成的signnature 跟我們自己的做對比。

微信開發工具地址:https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign&token=&lang=zh_CN

兩種結果:

最后生成的signnature 一樣:說明我們的簽名正確。 不一樣,說明我們的簽名失敗。(失敗的簽名是調用不到微信的自定義分享接口的,拿不到權限列表里面的權限。)

這里php語法下按字典序列排序外,還有個要點:

 $string1 = "jsapi_ticket=$jsapi_ticket&noncestr=$noncestr&timestamp=$timeing&url=$url";
 $signature =sha1($string1);
&timestamp 這里面會自動轉義成xtamp,前面部分轉義了。不過這里是正確的,直接用sha1()算法加密就是正確的串。在后面就是前端的配置了,配置好后,就完成了。
一切做完后,就可以將數據返回前端了。
這里要簡單說下思路,如果你的公眾號只有一個,而網站地址卻有2個或者3個的時候,你可以緩存現有的 ticket,還有appid.然后這個現有網站向另外兩個站提供api接口訪問。然后用另外網站的url,
重新生成有用的signature 字符串。這樣在返回前端,就可以做到多個站點的微信-js-sdk分享。為了安全期間,你可以在網絡上傳輸ticket,就夠了。appid。在另外一個站點中,放在配置文件,或者配置選項里面。

后面--一篇是分享的前端配置,如果有需要可以看下。>:)

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM