get請求陣列引數問題(序列化)
阿新 • • 發佈:2021-12-01
問題:
當我們需要通過get方式傳遞一個數組作為引數 tag:[1,2,3,4]
預期是解析為:https://www.cnblogs.com/enter?tag=1&tag=2&tag=3&tag=4
然而真相是這樣的:https://www.cnblogs.com/enter?tag[]=1&tag[]=2&tag[]=3&tag[]=4
,後臺是不可能解析到傳遞的引數。
解決方法
1、qs外掛處理
1、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' }) // 輸出結果:'a[0]=b&a[1]=c'2、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' }) // 輸出結果:'a[]=b&a[]=c' 3、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' }) // 輸出結果:'a=b&a=c' 4、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'comma' }) // 輸出結果:'a=b,c'
2、使用URLSearchParams方式
let params = new URLSearchParams() params.append('ids','1') params.append('ids','2') //輸出結果ids=1&ids=2
3、Axios配置
axios.interceptors.request.use(async (config) => { //只針對get方式進行序列化 if (config.method === 'get') { config.paramsSerializer = function(params) { return qs.stringify(params, { arrayFormat: 'repeat' }) } } }
4、小程式
let urlQueryString = qs.stringify(options.params, { //看繁華,聽風落使用到qs ,先下載,後引入 addQueryPrefix: true, allowDots: true, arrayFormat: 'repeat' }); myUrl += urlQueryString;