Блог

Меня попросили вызвать 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 })
},
  

Но затем мне сказали использовать функции API, которые уже существуют в некоторых xyz.js файл.

Мой 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 в своем API объекте, когда они уже настроили свойство как true в rest объекте]

Каковы преимущества использования axios.create({ , т. е. то, что они делают, по сравнению с тем, что я изначально делал this.$axios.post(

request это метод, определенный axios . Ссылка на документы.

request позволяет вам выполнять HTTP-вызов с любым глаголом, который вы хотите (POST, GET, DELETE, PUT). Скорее всего, axios вызывает request изнутри все другие вспомогательные методы ( get , post ), но это детали реализации. Одним из преимуществ использования request является то, что вам не нужно жестко кодировать HTTP-глагол (POST, GET …), и вы можете установить его во время выполнения в зависимости от ваших входных данных.

Я вижу 2 причины, по которым они установили withCredentials :

• setClient может вызываться, а может и не вызываться ранее something
• для наглядности: достаточно взглянуть на определение something , чтобы понять, что клиент использует учетные данные, и вам не нужна дополнительная информация о том, как rest это работает.

Я не думаю, что просьба к вам использовать something сводится к преимуществам axios.$post vs axios.create . Вероятно, это больше связано с тем, как организовать ваш код.

Некоторые преимущества использования отдельного модуля по сравнению с прямым вызовом axios

• при непосредственном вызове axios вы все время добавляете базовый URL, при использовании модуля для вашего REST API базовый URL скрыт и, возможно, облегчает чтение вашего кода
• вы можете настроить другие параметры внутри конфигурации и убедиться, что они используются. Например, у вас может быть токен доступа, модуль может хранить этот токен и всегда добавлять его к любому запросу. При вызове axios вручную вам нужно помнить об этом
• вы отделены от axios (в некоторой степени) (1). При использовании модуля вам на самом деле все равно, выполняет запросы axios или нет.
• Вы можете добавить в модуль больше вызовов API, которые сможете повторно использовать в будущем. Я ожидаю, что xyz файл будет расти со временем, и ваш вызов faceeBookCampaign в конечном итоге станет методом для rest переменной. В конечном итоге имеет смысл использовать this.client , а не something нет, но это зависит от разработчиков.
• он хранит все вызовы REST API в одном месте, позволяя вам создавать SDK для этого API, который по мере роста проекта может иметь свой собственный жизненный цикл.

(1) Я говорю, что id в некоторой степени разъединяет вас, потому что есть семантика, которую необходимо сохранить, чтобы все работало. Возвращаемый объект должен иметь метод запроса, который принимает объект конфигурации. Конфигурация должна соответствовать той же структуре, что и та, которую хочет axios. Но вы всегда можете написать для этого адаптер, так что вы фактически отделены от axios.

request здесь принимает конфигурацию и возвращает обещание. Я предполагаю, что этот подход обычно используется, когда вы хотите повторно использовать объект запроса, созданный с помощью create (по крайней мере, в моем понимании).

Я чувствую, что request метод используется для перезаписи начальной конфигурации новой, определенной в API . И двойное withCredentials должно быть оплошностью. Или, поскольку API определяет новый объект конфигурации, поэтому, если он определен без withCredentials , он перезапишет create конфигурацию.

Следовательно, похоже, что оно указано дважды.