フロントエンドとバックエンドの共同デバッグに関しては、パラメータを受信できないという問題があり、カラーペンのバックエンドに遭遇した場合、パラメータの形式が明確ではなく、インターフェイスドキュメントがないため、非常に困難です。頭痛。
Axios パラメータは、get(delete)、post(put) の 2 つのグループに分かれています。getとdeleteのパラメータの受け渡し方法は基本的に同じであり、postとputのメソッドも基本的に同じです。
1. get(delete) 転送配列をバックグラウンドで受信できません。
これらはどちらも疑問符パラメータです。つまり、パラメータは URL の疑問符の後ろで結合されます。
以上です:
しかし、配列を渡すときは面倒です:
export function getCrApplicationList(data) {
var test = [‘111‘, ‘222‘]
return request({
url: ‘/applicant/CrApplication/List‘,
method: ‘get‘,
params: {
test }
})
}
この場合、バックグラウンドは値を取得できないため、配列を次の形式に変更する必要があります。
まず axios のリクエスト インターセプトを見つけ、qs を使用し、次のコードを追加します。
if (config.method === 'get') {
// 如果是get请求，且params是数组类型如arr=[1,2]，则转换成url?ids=1&ids=2&ids=3
config.paramsSerializer = function(params) {
// return qs.stringify(params, { arrayFormat: 'repeat' })
return qs.stringify(params, {
indices: false })
}
}
コンソールの効果は次のとおりです。
投稿では基本的に、配列を受け入れることができないという問題は発生しません。発生した場合は、パラメータを直接フォーマットするだけです。
qs.stringify(params, {
indices: false })
qs ライブラリの配列の形式は次のとおりです。
qs.stringify({
ids: [1, 2, 3]}, {
indices: false })
// 形式： ids=1&ids=2&id=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: 'indices'})
// 形式： ids[0]=1&aids1]=2&ids[2]=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: 'brackets'})
// 形式：ids[]=1&ids[]=2&ids[]=3
qs.stringify({
ids: [1, 2, 3]}, {
arrayFormat: 'repeat'})
// 形式： ids=1&ids=2&id=3
2. ポスト（プット）パラメータの受け渡し問題
投稿リクエストがバックグラウンドでパラメータを受信できない場合は、次の側面から確認できます
- post パラメータはデータ
2 です。バックグラウンド
ではパラメータを渡すためにフォーム形式が必要ですか? Axios のデフォルトは jsonapplication/json;charset=utf-8 です。バックグラウンドでパラメータを渡すためにフォーム形式が必要な場合は、次のように設定する必要があります。
ヘッダーの Content-Type は application/x-www-form-urlencoded、charset=utf-8 または multipart/form-data です。
ポストパラメータの形式:
- application/x-www-form-urlencoded (フォームモード)
- application/json (JSON モード)
- multipart/form-data (ファイルモード)
補充:
1. 投稿リクエストの URL の疑問符の後にパラメータを渡すことはできますか?
答え: はい。URLの直後に結合
export function listGroup(query){
return request({
url:"/census/group/list"+'?pageNum='+query.pageNum+'&pageSize='+query.pageSize,
method:'post',
data:query
})
}
2. get リクエストの本文にパラメーターを含めることはできますか?
答え: いいえ。パラメータを渡すために URL に接続することしかできません
参考理由: GET リクエストでのボディフロントエンド Get リクエストの使用について
、ボディ内にパラメータをアップロードできますか?