1、后台接收數據時，判斷isAjax()始終未false
解決：這是因為axios 請求頭中沒有帶 X-Requested-With 這個參數
2、post請求正常了，但是后台接收到的數據始終是null，用$_POST與param都沒用
這是因為content-type 為 "application/json" 的數據 php 是不能直接識別的，所以導致 $_POST 數組為空。
解決：
下面給一個完整的例子，注冊賬號的例子
<!DOCTYPE html> <html> <head> <title>注冊</title> <link href="{$Think.config.static}/admin/css/aui.css" rel="stylesheet"> </head> <body> <div id="app"> <div class="aui-content aui-margin-b-15"> <ul class="aui-list aui-form-list"> <li class="aui-list-header">用戶注冊</li> <li class="aui-list-item"> <div class="aui-list-item-inner"> <div class="aui-list-item-label"> 用戶名： </div> <div class="aui-list-item-input"> <input type="text" placeholder="Name" v-model='name'> </div> </div> </li> <li class="aui-list-item"> <div class="aui-list-item-inner"> <div class="aui-list-item-label"> 密碼： </div> <div class="aui-list-item-input"> <input type="password" placeholder="Password" v-model="pwd"> </div> </div> </li> <li class="aui-list-item"> <div class="aui-list-item-inner"> <div class="aui-list-item-label"> 密碼確認： </div> <div class="aui-list-item-input"> <input type="password" placeholder="Password" v-model="pwd2"> </div> </div> </li> <li class="aui-list-item"> <div class="aui-list-item-inner aui-list-item-center aui-list-item-btn"> <div class="aui-btn aui-btn-info aui-margin-r-5" v-on:click="checkpwd()">注冊</div> <div class="aui-btn aui-btn-danger aui-margin-l-5" v-on:click="rewrite()">取消</div> </div> </li> </ul> </div> </div> </body> </html> <script type="text/javascript" src="{$Think.config.static}/admin/js/vue.js"></script> <script type="text/javascript" src="{$Think.config.static}/admin/js/axios.min.js"></script> <script> var vm=new Vue({ el:'#app', data:{ name:'', pwd:'', pwd2:'' }, methods:{ checkpwd:function(){ if(this.pwd!=''&&this.pwd2!=''&&this.name!=''){ if(this.pwd==this.pwd2){ this.register(this.name,this.pwd); }else{ alert('兩次密碼不一致！'); } }else{ alert('請輸入注冊數據！'); } }, rewrite:function(){ this.name=''; this.pwd=''; this.pwd2=''; }, register:function(name,pwd){ axios({ method: 'post', url: 'http://127.0.0.1/restudy/public/index.php/admin/index/register', headers:{"Content-Type":'application/x-www-form-urlencoded;charset=UTF-8','X-Requested-With': 'XMLHttpRequest'}, data:{ username:name, pwd:pwd } }) .then(function (response) { console.log(response) }) .catch(function (error) { console.log(error) }) } } }); </script>
public function register() { if(request()->isAjax()){ $post = json_decode(file_get_contents("php://input"), true); $username = $post['username']; $password = $post['pwd']; return json(['username'=>$username,'pwd'=>$password]); } return $this->fetch(); }
axios跨域的問題之前的文章有記錄，暫時算是解決問題了，不知道還有沒有其他的坑，有知道的拜托告訴一下