Question

有人要求我进行API调用以发送数据。

点击vue时，我触发了此事件

async facebookDataToSend () {
  let campaignID = await this.$store.getters['CurrentInstance/id']
  this.$axios.post(process.env.API_BASE_URL + 'faceeBookCampaign', { campaignID: campaignID }, { withCredentials: true })
},

但是后来，我被告知要使用一些xyz.js文件中已经存在的API函数。

我的xyz.js文件如下所示。

const rest = {
  something: axios.create({
    baseURL: process.env.API_BASE_URL,
    withCredentials: true
  }),
  setClient: function (client) {
    this.something = axios.create({
      baseURL: process.env.API_BASE_URL,
      withCredentials: true,
      params: {
        __somethingClient: client
      }
    })
    this.client = client
  }
}

在这里，我无法理解如何使用该实例进行api调用，因此我查看了他们已经进行api调用的代码，并看到了类似的内容

const API = {
  url: '/whateverHtml/',
        method: 'post',
        withCredentials: true,
        data: {
          'schemaType': 'something-event', // TODO FIXME
          'field': 'description', // TODO FIXME
          'html': this.model[this.field.key]
        }
api.something.request(API).then(result => {

我无法理解代码。对于初学者

什么是要求？我没有在something变量中看到rest内的任何方法或属性

第二次为什么他们已经在withCredentials: true对象中将属性设置为true的情况下在API对象中使用rest]

使用axios.create({的专业人士有什么用，即比我最初做的this.$axios.post(

Answer 1

request是axios定义的方法。链接到docs。

request允许您使用所需的任何动词（POST，GET，DELETE和PUT）进行HTTP调用。 axios很可能从所有其他帮助器方法（request，get）内部调用post，但这是实现的详细信息。使用request的优点之一是您不必对HTTP动词（POST，GET ...）进行硬编码，并且可以根据输入在运行时对其进行设置。

我看到他们设置withCredentials的两个原因：

setClient可能会在something前被调用
为清楚起见：查看something的定义就足以了解客户端正在使用凭据，并且您不需要任何有关rest的工作方式的信息。

我不认为要求您使用something可以归结为axios.$post与axios.create的优势。这可能与如何组织代码有关。

与单独调用axios相比，使用单独的模块的一些优势

当直接调用axios时，您一直都在使用基本URL，当为您的REST API使用模块时，基本URL被隐藏起来，并且可以使您的代码更易于阅读
您可以在config中烘烤其他选项，并确保已使用它们。例如，您可能有一个访问令牌，该模块可以存储该令牌并始终添加到任何请求中。手动致电axios时，您需要记住这一点
您与axios分离了（某种程度上）（1）。使用模块时，您实际上并不在乎axios是否在执行请求。
您可以向模块中添加更多API调用，以供将来重用。我希望xyz文件会随着时间增长，并且您对faceeBookCampaign的调用最终将成为rest变量上的方法。最终使用this.client而不是something更有意义，但这取决于开发人员。
它将所有REST API调用保持在一个位置，从而使您可以为该API构建一个SDK，随着项目的发展，该SDK可以拥有自己的生命周期。

（1）我说id在某种程度上使您解耦，因为需要保留语义，以便一切正常。返回的对象需要具有接受配置对象的请求方法。该配置需要遵循与axios所需结构相同的结构。但是，您始终可以为此编写一个adapter，因此实际上您已与axios分离。

Answer 2

request在这里接受配置并返回承诺。我猜想这种方法通常是在您要重用使用create创建的请求对象时采用的（至少在我看来）。

我觉得request方法用于用API中定义的新配置覆盖初始配置。并且，双withCredentials应该是疏忽大意。或者，由于API定义了一个新的配置对象，因此，如果在不使用withCredentials的情况下进行定义，它将覆盖create的配置。

因此，它看起来像指定了两次。

了解Axios创建的功能

2 个答案: