PbootCMS是一套開源且成熟的PHP建站系統,標簽簡單使用方便,利于它是相當省事的。近期需要用到VUE項目,結合PbootCMS的API接口調用數據,使用還是相當簡單的。今天主要講一下API強制認證方式下的實現步驟,希望對API接口感興趣的朋友能有所幫助。
基于安全考慮,建議調用接口的網站都開啟“API強制認證”,即有Appid,Appsecret,Timestamp,Signature組合的安全通道。功能調試的時候可以不啟用,基礎功能實現后網站后端開“API強制認證”,數據調取方在請求地址中加入相關token參數。
第一種:Ajax方式下實現(網站本地環境下實現)
<script> //document.write(hex_md5("admin")); $(document).ready(function (e) { var appid = 'test'; //后臺WebAPI中設置的AppID var appsecret = 'WxwHJOLSiowf123456'; //后臺WebAPI中設置的API認證密鑰 var timestamp = Date.parse(new Date()); timestamp = timestamp / 1000; //獲取當前時間戳 var signature = hex_md5(hex_md5(appid + appsecret + timestamp)); //構建signature var url='/api.php/cms/site'; $.ajax({ type: 'POST', url: url, dataType: 'json', data: { appid: appid,//{pboot:appid} timestamp: timestamp,//{pboot:timestamp} signature: signature//{pboot:signature} }, success: function (response, status) { if(response.code){ //獲取數據成功 alert(response.data.title); }else{ //返回錯誤數據 alert(response.data); } }, error:function(xhr,status,error){ //返回數據異常 alert('返回數據異常!'); } }); }); </script>
第二種:Axios方式下實現
<script type="text/javascript"> var appid = 'test'; //后臺WebAPI中設置的AppID var appsecret = 'WxwHJOLSiowf123456'; //后臺WebAPI中設置的API認證密鑰 var timestamp = Date.parse(new Date()); timestamp = timestamp / 1000; //獲取當前時間戳 var signature = hex_md5(hex_md5(appid + appsecret + timestamp)); //構建signature new Vue({ el:'#app', data () { return{ info: null } }, mounted(){ axios //alert(signature) .get("https://www.371jianzhan.com/api.php/cms/sort/scode/2", {params : {'appid':appid,'timestamp':timestamp,'signature':signature}}) .then(response => (this.info=response)) .catch(function(error){ //console.log(error); }); } }) </script>
注意事項:請一定要在網頁頭部引用MD5文件,<script src="md5.js"></script>,否則會出錯,系統要求對Signature進行二次MD5加密,所以要先包含這個加密文件。
特殊問題:當調試的時候發現提示“接口時間戳驗證失敗!”,一般是由于調試方與服務器時間不同步或差距較大造成的,請同步一下調試方電腦的日期和時間就可以解決這個問題。
免費咨詢:18838171308