如何使用 Axios 将 JSON 数据正确发送到 rails 服务器，以正确匹配所需的 rails 参数哈希？

Posted 2023-02-22

【中文标题】如何使用 Axios 将 JSON 数据正确发送到 rails 服务器，以正确匹配所需的 rails 参数哈希？

【英文标题】：How to send JSON data correctly using Axios to a rails server, to match the required rails params hash correctly?

【发布时间】：2018-05-30 07:36:24

【问题描述】：

我正在向 Rails 服务器发出 GET 请求，参数应如下所示：

"where"=>"producer_id"=>["7"]

我正在从 Vue 中的前端应用程序发出请求，并使用 Axios 发出请求。我提出这样的要求：

const data = await this.axios.get('http://localhost:3000/data.json', 
  headers: 
    'X-User-Token': this.$store.getters.authToken,
    'X-User-Username': this.$store.getters.user.username
  ,
  params: 
    where: 
      producer_id: data.producers
    
  
)

但是，在 rails 服务器输出中，它显示参数是这样发送的：

"where"=>"\"producer_id\":[\"7\"]"

因此我没有得到正确的数据。

我该如何解决这个问题？为什么params（where 对象）中的第二层是作为字符串发送的？

【参考方案1】：

事实证明，在这种情况下，参数必须被序列化https://github.com/axios/axios/issues/738

我也使用了paramsSerializer 函数来克服这个问题

const data = await this.axios.get('http://localhost:3000/data.json', 
  headers: 
    'X-User-Token': this.$store.getters.authToken,
    'X-User-Username': this.$store.getters.user.username
  ,
  params: 
    where: 
      producer_id: data.producers
    
  ,
  paramsSerializer: function (params) 
    return jQuery.param(params)
  
)

编辑：

我现在使用 qs 代替 jQuery：

axios.defaults.paramsSerializer = (params) => 
  return qs.stringify(params, arrayFormat: 'brackets')