一、媒介
axios是vue項目頂用來運用ajax手藝來與背景交流數據的一個組件,在vue的作者引薦下,相稱數目標vue前端開闢人員開始運用它。但是在現實開闢過程當中,卻時有湧現後端吸收不到前端post過來的數據的狀況。以PHP言語開闢的背景為例,PHP原生的預定義變量$_POST就沒法吸收(由於剖析失利)。本文的目標在於討論前後端數據交互,並給出差別的解決方案供人人參考。
二、現在$_POST可吸收的數據情勢
Form Data
這類數據情勢實在就是鍵值對,比方id:1,假如有多組鍵值對並且有嵌套的狀況,則以下
role-name:ta
role-desc:xxxxxxxxx
id:2
cloud[cla]:001
cloud[cla_baijia]:001
cloud[cla_gongkai]:001
local[soft5]:001
local[soft6]:001
mgmt[mgmt-clouditems]:01
PHP效勞端吸收到的數據現實上是這模樣的
role-name=ta&role-desc=xxxxxxxxx&id=2&cloud%5Bcla%5D=001&cloud%5Bcla_baijia%5D=001&cloud%5Bcla_gongkai%5D=001&local%5Bsoft-5%5D=001&local%5Bsoft-6%5D=001&mgmt%5Bmgmt-clouditems%5D=01
是不是是與url的參數特別像?
這類鍵值對的數據被稱為QueryString,瀏覽器的原生 form 表單發送這類數據時會把要求頭設為application/x-www-form-urlencoded。
QueryString就可以被PHP的$_POST勝利剖析
典範的前端庫jQuery下的jQuery ajax 的 serialize()要領和param()要領就是為把數據轉化為QueryString而供應的解決方案,前者轉化表單數據,後者轉化JSON數據。
而且jQuery的ajax要求中會推斷傳入的數據情勢,隱式挪用param()要領來轉化json數據,所以運用者只需直接供應json數據即可勝利把數據勝利提交到背景,須要顯式(手動)挪用param()要領的時機不多。jq默許的發送的要求頭也是application/x-www-form-urlencoded,大多數狀況下並不須要運用者手動設置。
回到我們的axios中,axios默許發送的要求頭為application/json,簡樸來講,它默許就是會把json傳到後端,並不轉化為QueryString。
三、解決要領
1、前端把數據轉化為QueryString
引入qs庫,挪用stringify要領
<template>
<div>
<input type="button" name="login" value="數據提交" @click="post">
</div>
</template>
<script>
import axios from "axios"
import qs from "qs"
var json={
"role-name": "ta",
"role-desc": "xxxxxxxxx",
"id": 2,
"cloud": {
"cla": "001",
"cla_baijia": "001",
"cla_gongkai": "001"
},
"local": {
"soft-5": "001",
"soft-6": "001"
},
"mgmt": {
"mgmt-clouditems": "01"
}
};
export default {
methods:{
post(){
axios.post("http://localhost/web/index.php/admin/login/login",json,{
//設置`transformRequest` ,在向效勞器發送前,修正要求數據,axios會依據修正後的數據,自動設置要求頭
transformRequest:[function(data){
return qs.stringify(data);//把數據轉化為QueryString
}]
}).then(res=>{
console.log(res);
})
}
}
}
</script>
2、PHP後端運用php://input獵取原始數據
在前端不做任何轉變的狀況下,由於預定義變量$_POST沒法剖析,php後端只能運用php://input獵取原始的數據,然後再轉化為想要的數據情勢。
假如PHP背景運用原生開闢,則可自定義一個函數處置懲罰每次要求的數據。
假如PHP背景運用特定的框架開闢,則要看框架自身是不是支撐處置懲罰php://input,簡樸的一個測試要領就是在框架的源代碼全文搜刮php://input,假如能搜到,則有支撐,不然不支撐,須要本身擴大相干的處置懲罰代碼。
以PHP框架yii2.0為例,全文搜刮vendor目次,可知在yiisoft->yii2->web->Request.php的494行有相干處置懲罰代碼。
現實運用只需在設置文件web.php設置
'components' => [
'request' => [
'parsers' => [
'application/json' => 'yii\web\JsonParser'
],
// 其他設置
],
//其他組件設置
]
以上就是前端處置懲罰和後端處置懲罰兩種解決方案,可依據現實狀況挑選