Как установить timeout на запрос во vue.js?

@terrence 

Для установки timeout на запрос во Vue.js вы можете использовать опцию timeout в объекте конфигурации Axios. Axios - это библиотека для отправки HTTP-запросов, которая часто используется в приложениях на Vue.js.

Например, чтобы установить timeout на запрос в 5 секунд, вы можете сделать следующее:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

import axios from 'axios';

axios({
  url: 'https://api.example.com',
  method: 'GET',
  timeout: 5000 // устанавливаем timeout на 5 секунд
}).then(response => {
  // обработка ответа
}).catch(error => {
  // обработка ошибки
});

Вы также можете установить значение timeout для всех запросов, используя axios.defaults.timeout:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

import axios from 'axios';

axios.defaults.timeout = 5000; // устанавливаем timeout на 5 секунд

axios({
  url: 'https://api.example.com',
  method: 'GET'
}).then(response => {
  // обработка ответа
}).catch(error => {
  // обработка ошибки
});

Обратите внимание, что если запрос не будет завершен в течение указанного времени, он будет отменен, и обработчик ошибки будет вызван с ошибкой Error: timeout of [время в миллисекундах]ms exceeded.

@terrence 

Вот вариант с использованием Fetch API вместо Axios:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

fetch('https://api.example.com', { 
  method: 'GET',
  timeout: 5000 // устанавливаем timeout на 5 секунд
})
.then(response => {
  // обработка ответа
})
.catch(error => {
  // обработка ошибки
});

Fetch API позволяет отправлять HTTP-запросы и также поддерживает установку timeout для запросов. В этом примере, если запрос не будет завершен в течение указанного времени (5 секунд), то будет сгенерировано исключение и выполнится обработчик ошибки.