Vue JS 如何接受 URLEncoded 格式答案

【问题标题】：Vue JS how to accept the URLEncoded formatVue JS 如何接受 URLEncoded 格式
【发布时间】：2021-08-26 19:39:09
【问题描述】：

我正在尝试接受邮递员中的 URL 编码格式以将一些数据发布到 Vue JS 应用程序，我使用的是以下编码格式，我该如何实现我应该使用哪个 npm 包？

【问题讨论】：

你是在问如何POST 数据来自 Vue 应用程序以那种格式？

标签： javascript vue.js vuejs2 vue-component vuex

【解决方案1】：

`x-www-form-urlencoded` 数据通过 HTTP 标头发送

大多数 HTTP 标头对您的前端 JavaScript 应用程序不可见。它们仅对响应请求的服务器可见。您无法直接从运行在 Web 浏览器中的 JavaScript 读取它们。

但是，有一些选择......

更改来源；将 POST 请求更改为 GET 并对 URL 中的参数进行编码
应用程序的反向代理可以通过一些额外的编码或配置从 POST 参数转换为 GET 参数
在您的服务器上接收请求并将它们输入到您的 Vue.js 应用程序中；使用 php/asp/etc 之类的东西来提供您的 html 而不是静态 HTML 文件，并将发布的参数嵌入到生成的 HTML 页面中

如果您有创意，可能还有其他选择，但最简单的是第一个 - 只需更改来源，使其不再发布数据。

【讨论】：

【解决方案2】：

我通过添加中间件（服务器端代码，例如 .net Web API）解决了它，然后使用查询字符串重定向它）

【讨论】：

【解决方案3】：

你可以使用 axios

const axios = require('axios')


const params = new URLSearchParams()
params.append('name', 'Akexorcist')
params.append('age', '28')
params.append('position', 'Android Developer')
params.append('description', 'birthdate=25-12-1989&favourite=coding%20coding%20and%20coding&company=Nextzy%20Technologies&website=http://www.akexorcist.com/')
params.append('awesome', true)

const config = {
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  }
}

axios.post(url, params, config)
  .then((result) => {
    // Do somthing
  })
  .catch((err) => {
    // Do somthing
  })

【讨论】：

x-www-form-urlencoded 数据通过 HTTP 标头发送

`x-www-form-urlencoded` 数据通过 HTTP 标头发送