其實這個開發原理很簡單，無非就是在文章頁面加一個支付的按鈕，點擊支付後把隱藏的部分給顯示出來或者直接跳轉到全文地址。
當然了，這個文章介面也是模仿官方來寫的，你可以查看官方的樣式，然後模仿就可以了，這個沒啥難度。主要是加個按鈕在這個頁面，下面是這個頁面的代碼：
readpay.php
<?phpheader('Content-type:text/html; Charset=utf-8');$mchid = '支付商戶號'; //支付商戶號$appid = '支付申請對應的公眾號的APPID'; //支付申請對應的公眾號的APPID$appKey = '支付申請對應的公眾號的APPSECRET'; //支付申請對應的公眾號的APPSECRET$apiKey = 'API密鑰'; //帳戶設定-安全設定-API安全-API密鑰-設定API密鑰//①、擷取使用者openid$wxPay = new WxpayService($mchid,$appid,$appKey,$apiKey);$openId = $wxPay->GetOpenid(); //擷取openidif(!$openId) exit('擷取openid失敗');//②、統一下單$outTradeNo = uniqid(); //你自己的商品訂單號$payAmount = 0.01; //付款金額，單位:元$orderName = 'test'; //訂單標題$notifyUrl = 'nofity.php'; //付款成功後的回調地址,一般放在本頁面的同級目錄即可$payTime = time(); //付款時間$jsApiParameters = $wxPay->createJsBizPackage($openId,$payAmount,$outTradeNo,$orderName,$notifyUrl,$payTime);$jsApiParameters = json_encode($jsApiParameters);?> <!--下面就是木方官方文章頁面--> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"/> <title>新版支援雙開，王利芬慶祝“茅侃侃去世”文閱讀10w+被批人血饅頭</title> <script type="text/javascript"> //調用JS api 支付 function jsApiCall() { WeixinJSBridge.invoke( 'getBrandWCPayRequest', <?php echo $jsApiParameters; ?>, function(res){ WeixinJSBridge.log(res.err_msg); //alert(res.err_code+res.err_desc+res.err_msg); if(res.err_msg == "get_brand_wcpay_request:ok"){ //支付成功跳轉頁面 window.location.href="這裡填寫支付成功後要跳轉的查看全文文章地址"; }else{ //支付失敗/或取消支付跳轉頁面，自己自訂開發頁面 window.location.href="false.html"; } } ); } function callpay() { if (typeof WeixinJSBridge == "undefined"){ if( document.addEventListener ){ document.addEventListener('WeixinJSBridgeReady', jsApiCall, false); }else if (document.attachEvent){ document.attachEvent('WeixinJSBridgeReady', jsApiCall); document.attachEvent('onWeixinJSBridgeReady', jsApiCall); } }else{ jsApiCall(); } } </script> <!--下面就是木方官方文章頁面的CSS--> <style> #title{ margin-bottom:10px; line-height:1.4; font-weight:400; font-size:24px; width: 97%; margin:0 auto; } #meta_content .time{ color: #8C8C8C; font-family: "SimHei"; } .author{ color: #8C8C8C; font-family: "SimHei"; } .name{ color: #607fa6; } #con{ width:95%; font-size: 15px; margin:15px auto 25px; color: #595757; } </style> </head> <body> <br/> <!--文章標題--> <h2 id="title">新版支援雙開，王利芬慶祝“茅侃侃去世”文閱讀10w+被批人血饅頭</h2> <p id="meta_content"> <!--發布時間、作者、公眾號暱稱--> <span class="time">2018-01-27</span> <span class="author">tanking</span> <span class="name">裡客雲</span> </p> <!--顯示的部分內容，未支付前顯示的內容--> <p id="con"> 這一周，公眾號議論最多的有“周沖的影像聲色”因洗稿被撕、80後創業者茅侃侃去世、劉亦菲分手......幾乎每件事都能在朋友圈刷到相關報道。此外，視頻大號“一條”又拿到了新一輪融資，你最關心哪一件事呢？ </p> <!--支付按鈕--> <p align="center"> <button style="width:180px; height:35px;background: none; border-radius: 5px;border:1px #1AAD19 solid; cursor: pointer; color:#1AAD19; font-size:15px;-webkit-tap-highlight-color:rgba(255,0,0,0);" type="button" onclick="callpay()" >支付0.01閱讀全文</button> </p> </body> </html> <!--下面是支付邏輯了--><?phpheader("Content-Type:text/html; charset=utf-8");class WxpayService{ protected $mchid; protected $appid; protected $appKey; protected $apiKey; public $data = null; public function __construct($mchid, $appid, $appKey,$key) { $this->mchid = $mchid; //https://pay.weixin.qq.com 產品中心-開發配置-商戶號 $this->appid = $appid; //支付申請對應的公眾號的APPID $this->appKey = $appKey; //支付申請對應的公眾號的APP Key $this->apiKey = $key; //https://pay.weixin.qq.com 帳戶設定-安全設定-API安全-API密鑰-設定API密鑰 } /** * 通過跳轉擷取使用者的openid，跳轉流程如下： * 1、設定自己需要調回的url及其其他參數，跳轉到伺服器https://open.weixin.qq.com/connect/oauth2/authorize * 2、服務處理完成之後會跳回使用者redirect_uri地址，此時會帶上一些參數，如：code * @return 使用者的openid */ public function GetOpenid() { //通過code獲得openid if (!isset($_GET['code'])){ //觸發返回code碼 $scheme = $_SERVER['HTTPS']=='on' ? 'https://' : 'http://'; $baseUrl = urlencode($scheme.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].$_SERVER['QUERY_STRING']); $url = $this->__CreateOauthUrlForCode($baseUrl); Header("Location: $url"); exit(); } else { //擷取code碼，以擷取openid $code = $_GET['code']; $openid = $this->getOpenidFromMp($code); return $openid; } } /** * 通過code從工作平台擷取openid機器access_token * @param string $code 跳回來帶上的code * @return openid */ public function GetOpenidFromMp($code) { $url = $this->__CreateOauthUrlForOpenid($code); $res = self::curlGet($url); //取出openid $data = json_decode($res,true); $this->data = $data; $openid = $data['openid']; return $openid; } /** * 構造擷取open和access_toke的url地址 * @param string $code，跳轉帶回的code * @return 請求的url */ private function __CreateOauthUrlForOpenid($code) { $urlObj["appid"] = $this->appid; $urlObj["secret"] = $this->appKey; $urlObj["code"] = $code; $urlObj["grant_type"] = "authorization_code"; $bizString = $this->ToUrlParams($urlObj); return "https://api.weixin.qq.com/sns/oauth2/access_token?".$bizString; } /** * 構造擷取code的url串連 * @param string $redirectUrl 伺服器回跳的url，需要url編碼 * @return 返回構造好的url */ private function __CreateOauthUrlForCode($redirectUrl) { $urlObj["appid"] = $this->appid; $urlObj["redirect_uri"] = "$redirectUrl"; $urlObj["response_type"] = "code"; $urlObj["scope"] = "snsapi_base"; $urlObj["state"] = "STATE"."#wechat_redirect"; $bizString = $this->ToUrlParams($urlObj); return "https://open.weixin.qq.com/connect/oauth2/authorize?".$bizString; } /** * 拼接簽名字串 * @param array $urlObj * @return 返回已經拼接好的字串 */ private function ToUrlParams($urlObj) { $buff = ""; foreach ($urlObj as $k => $v) { if($k != "sign") $buff .= $k . "=" . $v . "&"; } $buff = trim($buff, "&"); return $buff; } /** * 統一下單 * @param string $openid 調用【網頁授權擷取使用者資訊】介面擷取到使用者在該公眾號下的Openid * @param float $totalFee 收款總費用 單位元 * @param string $outTradeNo 唯一的訂單號 * @param string $orderName 訂單名稱 * @param string $notifyUrl 支付結果通知url 不要有問號 * @param string $timestamp 支付時間 * @return string */ public function createJsBizPackage($openid, $totalFee, $outTradeNo, $orderName, $notifyUrl, $timestamp) { $config = array( 'mch_id' => $this->mchid, 'appid' => $this->appid, 'key' => $this->apiKey, ); $orderName = iconv('GBK','UTF-8',$orderName); $unified = array( 'appid' => $config['appid'], 'attach' => 'pay', //商家資料包，原樣返回，如果填寫中文，請注意轉換為utf-8 'body' => $orderName, 'mch_id' => $config['mch_id'], 'nonce_str' => self::createNonceStr(), 'notify_url' => $notifyUrl, 'openid' => $openid, //rade_type=JSAPI，此參數必傳 'out_trade_no' => $outTradeNo, 'spbill_create_ip' => '127.0.0.1', 'total_fee' => intval($totalFee * 100), //單位 轉為分 'trade_type' => 'JSAPI', ); $unified['sign'] = self::getSign($unified, $config['key']); $responseXml = self::curlPost('https://api.mch.weixin.qq.com/pay/unifiedorder', self::arrayToXml($unified)); $unifiedOrder = simplexml_load_string($responseXml, 'SimpleXMLElement', LIBXML_NOCDATA); if ($unifiedOrder === false) { die('parse xml error'); } if ($unifiedOrder->return_code != 'SUCCESS') { die($unifiedOrder->return_msg); } if ($unifiedOrder->result_code != 'SUCCESS') { die($unifiedOrder->err_code); } $arr = array( "appId" => $config['appid'], "timeStamp" => "$timestamp", //這裡是字串的時間戳記，不是int，所以需加引號 "nonceStr" => self::createNonceStr(), "package" => "prepay_id=" . $unifiedOrder->prepay_id, "signType" => 'MD5', ); $arr['paySign'] = self::getSign($arr, $config['key']); return $arr; } public static function curlGet($url = '', $options = array()) { $ch = curl_init($url); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_TIMEOUT, 30); if (!empty($options)) { curl_setopt_array($ch, $options); } //https請求 不驗證認證和host curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); $data = curl_exec($ch); curl_close($ch); return $data; } public static function curlPost($url = '', $postData = '', $options = array()) { if (is_array($postData)) { $postData = http_build_query($postData); } $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_POSTFIELDS, $postData); curl_setopt($ch, CURLOPT_TIMEOUT, 30); //設定cURL允許執行的最長秒數 if (!empty($options)) { curl_setopt_array($ch, $options); } //https請求 不驗證認證和host curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); $data = curl_exec($ch); curl_close($ch); return $data; } public static 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; } public static function arrayToXml($arr) { $xml = "<xml>"; foreach ($arr as $key => $val) { if (is_numeric($val)) { $xml .= "<" . $key . ">" . $val . "</" . $key . ">"; } else $xml .= "<" . $key . "><![CDATA[" . $val . "]]></" . $key . ">"; } $xml .= "</xml>"; return $xml; } public static function getSign($params, $key) { ksort($params, SORT_STRING); $unSignParaString = self::formatQueryParaMap($params, false); $signStr = strtoupper(md5($unSignParaString . "&key=" . $key)); return $signStr; } protected static function formatQueryParaMap($paraMap, $urlEncode = false) { $buff = ""; ksort($paraMap); foreach ($paraMap as $k => $v) { if (null != $v && "null" != $v) { if ($urlEncode) { $v = urlencode($v); } $buff .= $k . "=" . $v . "&"; } } $reqPar = ''; if (strlen($buff) > 0) { $reqPar = substr($buff, 0, strlen($buff) - 1); } return $reqPar; }}?>
nofity.php
<?php/** * 原生支付（掃碼支付）及公眾號支付的非同步回調通知 * 說明：需要在native.php或者jsapi.php中的填寫回調地址。例如：http://www.xxx.com/wx/notify.php * 付款成功後，伺服器會將付款結果通知到該頁面 */header('Content-type:text/html; Charset=utf-8');$mchid = '支付商戶號';$appid = '公眾號APPID'; $apiKey = 'API密鑰'; $wxPay = new WxpayService($mchid,$appid,$apiKey);$result = $wxPay->notify();if($result){ //完成你的邏輯 //例如串連資料庫，擷取付款金額$result['cash_fee']，擷取訂單號$result['out_trade_no']，修改資料庫中的訂單狀態等;}else{ echo 'pay error';}class WxpayService{ protected $mchid; protected $appid; protected $apiKey; public function __construct($mchid, $appid, $key) { $this->mchid = $mchid; $this->appid = $appid; $this->apiKey = $key; } public function notify() { $config = array( 'mch_id' => $this->mchid, 'appid' => $this->appid, 'key' => $this->apiKey, ); $postStr = $GLOBALS["HTTP_RAW_POST_DATA"]; $postObj = simplexml_load_string($postStr, 'SimpleXMLElement', LIBXML_NOCDATA); if ($postObj === false) { die('parse xml error'); } if ($postObj->return_code != 'SUCCESS') { die($postObj->return_msg); } if ($postObj->result_code != 'SUCCESS') { die($postObj->err_code); } $arr = (array)$postObj; unset($arr['sign']); if (self::getSign($arr, $config['key']) == $postObj->sign) { echo '<xml><return_code><![CDATA[SUCCESS]]></return_code><return_msg><![CDATA[OK]]></return_msg></xml>'; return $arr; } } /** * 擷取簽名 */ public static function getSign($params, $key) { ksort($params, SORT_STRING); $unSignParaString = self::formatQueryParaMap($params, false); $signStr = strtoupper(md5($unSignParaString . "&key=" . $key)); return $signStr; } protected static function formatQueryParaMap($paraMap, $urlEncode = false) { $buff = ""; ksort($paraMap); foreach ($paraMap as $k => $v) { if (null != $v && "null" != $v) { if ($urlEncode) { $v = urlencode($v); } $buff .= $k . "=" . $v . "&"; } } $reqPar = ''; if (strlen($buff) > 0) { $reqPar = substr($buff, 0, strlen($buff) - 1); } return $reqPar; }}
簡單說明：
1】建立readpay.php，拷貝上面的代碼，修改商戶號、appid、appsecret、密鑰即可，還有下面的回調地址的路徑(nofity.php)，至於支付成功和支付失敗跳轉的頁面按自己的需求修改即可。
支付金額、文章標題】時間、作者、公帳號名稱等根據自己的需求修改。
要注意，訂單標題不能為中文，否則會提示body參數錯誤什麼的。
2】建立nofity.php
把上面的代碼拷貝上去，修改商戶號、appid、密鑰即可。
上傳到支付授權目錄，然後訪問readpay.php頁面測試。
3】建立false.html，這個是支付失敗的頁面，至於支付失敗要顯示什麼或者輸出什麼，這個根據你的業務來自訂開發。
相關推薦：
PHP寫公眾號文章頁採集方法_php執行個體
公眾號實現使用者管理功能
公眾號開發的詳細介紹
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
