Step Cards API

Данный раздел содержит документацию REST API AJAX сервера Dan.IT Education для работы со степ-проектом "Cards". Здесь будут описаны примеры запросов на сервер используя Fetch API.

Вступление

Все манипуляции с карточками (создание, обновление, удаление) происходят с помощью AJAX-запросов к серверу.

Регистрация

Для начала работы с сервером необходимо зарегистрироваться здесь:

Регистрация

После ввода имейла и пароля на странице регистрации, вы получите уникальный токен, который необходимо будет использовать для совершения всех запросов на сервер.

Данный токен можно сразу сохранить, либо получить его позже, отправив запрос по адресу логина (см. ниже).

Токен для работы с сервером

Все GET, POST, PUT и DELETE запросы на сервер требуют авторизации. Для этого вам нужно к каждому запросу добавлять в заголовке запроса по имени Authorization ваш токен в следующем виде: 

Authorization: `Bearer ${token}`

Если вы не передали или неправильно передали токен в заголовке, то получите от сервера ответ с кодом 401 и сообщением: 

Incorrect username or password

Увидев такую ошибку, знайте - вы неправильно передали токен в заголовке.

Получение токена после регистрации

Токен можно повторно получить, сделав POST запрос по адресу https://ajax.test-danit.com/api/v2/cards/login, и отправив туда ваш имейл и пароль: 

fetch("https://ajax.test-danit.com/api/v2/cards/login", {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ email: 'your@email.com', password: 'password' })
})
  .then(response => response.text())
  .then(token => console.log(token))

// Output
e93c5f9e-f35e-4a0f-886e-eb66a8182c55
Info iconВажно!

Обратите внимание, что в данном случае промис резолвится с помощью метода .text(), а не .json(), так как ответ от сервера содержит строку, а не объект в формате JSON.

Основные операции

Создание карточки

Для создания карточки после заполнения формы в модальном окне вам нужно отправить POST запрос по адресу https://ajax.test-danit.com/api/v2/cards. Все, что вы напишете в теле запроса, попадет в базу данных как содержимое карточки.

Пример запроса (не обязательно отправлять именно такие данные): 

fetch("https://ajax.test-danit.com/api/v2/cards", {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'Authorization': `Bearer ${token}`
  },
  body: JSON.stringify({
    title: 'Визит к кардиологу',
    description: 'Плановый визит',
    doctor: 'Cardiologist',
    bp: '24',
    age: 23,
    weight: 70
  })
})
  .then(response => response.json())
  .then(response => console.log(response))

// Output
{
  "id": 1,
  "title": "Визит к кардиологу",
  "description": "Плановый визит",
  "doctor": "Cardiologist",
  "bp": "24",
  "age": 23,
  "weight": 70
}

При успешном добавлении карточки в базу, в качестве ответа вы получите переданный вами объект с добавлением "id" карточки в базе.

Не забудьте сохранить в объекте, описывающем эту карточку, полученный "id".

Info iconВажно!

Обратите внимание, что любой запрос на сервер, требующий отправки тела запроса (POST, PUT) обязательно должен сопровождаться заголовком Content-Type со значением application/json.

Удаление карточки

Удаление карточки происходит при нажатии на крестик в верхнем правом углу карточки. Для удаления карточки из базы данных вам нужно отправить DELETE запрос по адресу https://ajax.test-danit.com/api/v2/cards/${cardId}, указав в качестве ${cardId} уникальный номер карточки из базы данных, полученный вами после создания карточки.

Пример запроса: 

fetch("https://ajax.test-danit.com/api/v2/cards/1", {
  method: 'DELETE',
  headers: {
    'Authorization': `Bearer ${token}`
  },
})

Если удаление прошло успешно, сервер пришлет пустой ответ со статусом 200.

Info iconВажно!

Любой запрос на сервер (кроме запроса на логин) требует наличия токена в заголовках запроса.

Получение всех созданных карточек

Если вы хотите получить все созданные вами карточки, необходимо отправить GET запрос по адресу https://ajax.test-danit.com/api/v2/cards, указав ваш токен в заголовке запроса (подробнее см. выше). В качестве ответа вы получите массив созданых вашей командой карточек в формате JSON, после чего на их основе можно создать объекты нужного класса (VisitDentist, VisitCardiologist, VisitTherapist и т.д.) и, используя их метод render(), вывести их на экран.

Получение одной карточки

Если вы хотите получить данные об одной карточке, необходимо отправить GET запрос по адресу https://ajax.test-danit.com/api/v2/cards/${cardId}, указав в качестве ${cardId} уникальный номер карточки из базы данных.

Изменение данных карточки

Для обновления карточки после ее редактирования, необходимо отправить PUT запрос по адресу https://ajax.test-danit.com/api/v2/cards/${cardId}, указав в качестве ${cardId} уникальный номер карточки из базы данных, а в теле запроса - новое содержимое карточки.

Пример запроса: 

fetch("https://ajax.test-danit.com/api/v2/cards/1", {
  method: 'PUT',
  headers: {
    'Content-Type': 'application/json',
    'Authorization': `Bearer ${token}`
  },
  body: JSON.stringify({
    id: 1,
    title: 'Визит к кардиологу',
    description: 'Новое описание визита',
    doctor: 'Cardiologist',
    bp: '24',
    age: 23,
    weight: 70
  })
})
  .then(response => response.json())
  .then(response => console.log(response))

// Output
{
  "id": 1,
  "title": "Визит к кардиологу",
  "description": "Новое описание визита",
  "doctor": "Cardiologist",
  "bp": "24",
  "age": 23,
  "weight": 70
}

При успешном изменении содержимого карточки в базе данных, в качестве ответа вы получите переданный вами объект с измененным содержимым.

8