1）首先是官方介面文件：

2）坑一：接入準備

　　1、需要在微信公眾號平臺裡配置“JS介面安全域名”，位置：公眾號設定-》功能設定-》JS介面安全域名；

　　2、配置“網頁授權域名”（獲取openid時需要用到，怎麼獲取這裡就不說了），位置同上：公眾號設定-》功能設定-》網頁授權域名

3）坑二：api_ticket、signature

　　1、新增卡券需要的api_ticket和signature（簽名），和預設的 jsapi_ticket、signature 都不同，最坑的是，官方的jssdk裡還沒相關的demo，所以要自己寫，獲取方法如下：

　　整合進jssdk.php，大概是這樣子

  
  public function getWxCardApiTicket(){
    // api_ticket 應該全域性儲存與更新，以下程式碼以寫入到檔案中做示例
    $data = json_decode($this->get_php_file("wxcard_api_ticket.php"));
    if ($data->expire_time < time()) {
      $accessToken = $this->getAccessToken();
      // 如果是企業號用以下 URL 獲取 ticket
      $url    = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$accessToken
 
}&type=wx_card";
      $res    = json_decode($this->httpGet($url));
      $ticket = $res->ticket;
      if ($ticket) {
        $data->expire_time  = time() + 7000;
        $data->api_ticket   = $ticket;
        $this->set_php_file("wxcard_api_ticket.php", json_encode($data));
      }
    } 
 
else {
      $ticket = $data->api_ticket;
    }

    return $ticket;
  }

　　2、卡券簽名大概是這樣子，根據自己專案的邏輯非同步請求計算簽名（假設是xxx.php）

$jssdk      = new JSSDK("appId", "appSecret");
$api_ticket = $jssdk->getWxCardApiTicket();

$code       = '';
$arr        = array($api_ticket, $code, $_GET['timestamp'], $_GET['nonceStr'], $_GET['card_id'], $_SESSION['openid']);
sort($arr, SORT_STRING);

$signature  = sha1(implode($arr));

echo json_encode(array('signature'=>$signature));
exit;

4）坑四：js配置

　　1、js的config配置（jsApiList）需要新增 'addCard';

　　2、addCard方法裡的cardExt裡需要 'nonce_str' 引數（官方的demo.js裡並沒有nonce_str引數，但親測沒這個引數會報簽名錯誤！）；

　　3、cardExt裡引數和要後臺計算簽名的引數保持一致（時間戳也要保持一致）；

使用card_id非同步計算簽名並呼叫新增卡券方法的示例：

function addCard(card_id){
    var data={'opendid':'<{$smarty.session.openid}>','card_id':card_id,'timestamp':'<?php echo $signPackage["timestamp"];?>','nonceStr':'<?php echo $signPackage["nonceStr"];?>'};
    $.get('xxxx.php',data,function(res){
        wx.addCard({
            cardList: [
                {
                    cardId: card_id,
                    cardExt: '{"code":"", "openid": "<{$smarty.session.openid}>", "nonce_str":"<?php echo $signPackage["nonceStr"];?>","timestamp": "<?php echo $signPackage["timestamp"]; ?>", "signature":"'+res.signature+'"}'
                }
            ],
            success: function (res) {
                alert('已新增卡券：' + JSON.stringify(res.cardList));
             },
            cancel: function (res) {
                alert(JSON.stringify(res))
            }
        });
    },'json');
}

5）坑五：注意變數名大小寫，有無下劃線等等

原文出處：http://www.cnblogs.com/tujia/p/6066522.html