Как сделать GET-вызов API с помощью Axios в JavaScript?

Опубликовано: 1 Августа, 2021

Axios - это HTTP-клиент на основе обещаний, разработанный для Node.js и браузера. С помощью Axios мы можем легко отправлять асинхронные HTTP-запросы к REST API и выполнять операции создания, чтения, обновления и удаления. Это совместный проект с открытым исходным кодом, размещенный на Github. Его можно импортировать в простой Javascript или, соответственно, в любую библиотеку.
Следующий scrpt src будет включать axios.js в заголовок вашего HTML-кода.

 <script src = "https://unpkg.com/axios/dist/axios.min.js"> </script>

Когда мы отправляем запрос к API с помощью axios, он возвращает ответ. Объект ответа состоит из:

data: данные, возвращаемые сервером.
status: HTTP-код, возвращенный сервером.
statusText: статус HTTP, возвращаемый сервером.
заголовки: заголовки, полученные с сервера.
config: исходная конфигурация запроса.
запрос: объект запроса.

В целях демонстрации мы разместим API на локальном хосте:

 http://127.0.0.1:5000

Сценарий Python: вам потребуются следующие пакеты для запуска API, flask, requests, jsonify, flask_cors . Код для Python API выглядит следующим образом:

Программа:

 from flask import Flask, jsonify, request
 from flask_cors import CORS
 
app = Flask(__name__)
 CORS(app)
 
@app .route( '/test' , methods = [ 'GET' ])
 def test():
   return jsonify({ "Result" : "Welcome to GeeksForGeeks" })
 
if __name__ = = '__main__' :
    app.run(debug = True ) 

Примечание. Вы можете разместить этот API, просто запустив указанный выше код Python.

Скрипт JS: включите axios.js и соответствующий файл JS в файл HTML. В файле JS напишите следующий код, который выполняет запрос GET с помощью Axios к API. Для запроса GET к API требуется путь к методу API .

Программа:

 function makeGetRequest(path) {
    axios.get(path).then(
        (response) => {
            var result = response.data;
            console.log(result);
        },
        (error) => {
            console.log(error);
        }
    );
 }
 makeGetRequest( ' http://127.0.0.1:5000/test ' ); 

Вывод: он вызовет API с запросом GET. Ответ будет получен в окне консоли .

Как сделать GET-вызов API с помощью Axios в JavaScript?

РЕКОМЕНДУЕМЫЕ СТАТЬИ