Chrome DevTools — это набор инструментов веб-разработчика, встроенных непосредственно в браузер Google Chrome. Этот инструмент значительно упростил отладку. Встроенный инструмент разработчика позволяет редактировать страницу, отлаживать ее, а также предоставлять им доступ для работы во внутреннем веб-браузере и приложении. Это повышает производительность разработчиков, а также упрощает диагностику сайта. Ниже приведены некоторые наиболее важные функции инструментов разработчика Chrome.
- Easy Access on Desktop or Mobile
- Element Tab
- Console
- Network
- Performance
- Memory Track Down Memory Leaks
- Application: Inspect Resources
- Security
- Audits or Lighthouse
API — это аббревиатура от Application Programming Interface, которая представляет собой набор протоколов связи и подпрограмм, используемых различными программами для связи между ними. Доступны различные типы API, такие как
- WEB APIs
- LOCAL APIs
- PROGRAM APIs
- SOAP (SIMPLE OBJECT ACCESS PROTOCOL)
- REST (Representational State Transfer)
В этой статье мы увидим, как мы можем использовать этот инструмент для тестирования наших API.
Пошаговая реализация
Шаг 1. Откройте инструменты разработчика Chrome
Перейдите в браузер Chrome> щелкните 3 вертикальные точки в правом углу> Дополнительные инструменты> Инструменты разработчика, как показано на изображении ниже.
А вот так выглядят инструменты разработчика. Отрегулируйте экран по своему усмотрению. И перейдите на вкладку » Сеть «, потому что в этом инструменте есть много вещей для изучения, но для тестирования API нам нужна вкладка „Сеть“, как показано на изображении ниже.
Шаг 2: нажмите на конечную точку
Теперь на вкладке URL-адрес нажмите вашу конечную точку или URL-адрес, который вы хотите протестировать. Предположим, в этой статье мы помещаем следующий URL-адрес, который мы создали в этой статье » Привязка данных в Spring MVC с помощью примера «.
http://localhost:8080/simple-calculator/********/home
И всякий раз, когда вы вводите URL-адрес и нажимаете Enter, вы можете видеть, что что-то происходит на вкладке «Сеть». Обратитесь к изображению ниже, чтобы увидеть, что происходит.
Теперь нажмите на свою конечную точку, и вы увидите в части «Заголовки» все, что связано с вашим API. Настоятельно рекомендуется также изучить вкладку Preview, Response, Timing, Cookies. Обратитесь к изображению ниже.
Шаг 3: Давайте установим некоторые значения и посмотрим, что произойдет
Теперь давайте поместим некоторые значения и нажмем кнопку Bind Data, и вы можете увидеть на изображении ниже, что мы получаем нашу следующую конечную точку, которая находится со строкой запроса.
process-homepage?firstName=Amiya&lastName=Rout
А также в части Payload вы можете увидеть наш параметр запроса.
Справочная статья: Понимание строки запроса и параметра запроса в Spring MVC
Вот как вы можете поиграть с этими инструментами разработчика Chrome и протестировать свой API в случае сбоя или в соответствии с вашими требованиями. Есть много вещей, которые вы можете изучить в этом инструменте, и он очень полезен для тестирования ваших API.
