Перейти к содержимому

Как запустить json server

  • автор:

Возникла проблема с запуском json-server

Ошибка при запуске json-server

Пытался запустить json-server, но выдавало ошибку. Пытался запустить через консоль в Windows и в терминале VScode, но безуспешно. npm пакет установлен локально для проекта и папка db.json присутствует в проекте.

Отслеживать
задан 3 фев 2021 в 11:09
11 1 1 бронзовый знак
Укажите полный путь к исполняющемуся файлу, а`ля: node_modules/. /json-server/.
3 фев 2021 в 11:12

1 ответ 1

Сортировка: Сброс на вариант по умолчанию

Попробуйте запустить через команду npx json-server —watch db.json

Отслеживать
ответ дан 5 мар 2021 в 6:33
Игорь Подгорный Игорь Подгорный
11 1 1 бронзовый знак

  • javascript
  • npm
    Важное на Мете
Похожие

Подписаться на ленту

Лента вопроса

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

Дизайн сайта / логотип © 2024 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2024.1.8.3130

Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.

JSON-server. Тестируем front-end без back-end

JSON-server. Тестируем front-end без back-end

В последние время по вечерам частенько играюсь с JavaScript и фреймворком angular.js. Сидишь себе, что-нибудь изобретаешь, и постоянно упираешься в одну и ту же проблему – чтобы нормально потестить новоиспеченное приложение необходимо принимать какие-нибудь данные с сервера.

Например, хочется мне сделать телефонный справочник. Не проблема, накидываю структуру, пишу JS и все бы хорошо, но ведь в реале телефоны должны храниться на сервере. Пока сервера нет – создаю заглушки, но это удобно далеко не всегда. Как было бы хорошо иметь какую-нибудь тулзу, которой можно скормить файл в json формате и получить готовое API для проведения тестов.

Json-сервер. Строим велосипед

Сначала мне было лень что-то искать, и я решил проблему по-нашему, по-программерски. Написал небольшой скриптик, который отдавал подготовленный набор данных в формате json. Все дешево и сердито. Вроде данные возвращает, но нет возможности генерировать нормальную структуру пути (например, users/1/comments). Вдоволь поигравшись со своим велосипедом и получив ломку в виде «мне не хватает гибкости», мне пришлось выбросить свое творение и отправиться на GiHub в поиске чего-то более продвинутого.

Json-server – решение всех моих проблем

Поиск по ключевым словам “json server” сразу вывел меня на проект «json-server». На момент поиска проект насчитывал больше 7000 звездочек, а это один из признаков качества и популярности решения. Бегло прочитав описание, понял, что это то что мне и нужно, даже больше.

JSON-server позволяет решить сразу несколько проблем:

Скармливаем подготовленный файл json-server и сразу получаем поднятый web-сервер с готовым API: http://localhost:3000/posts/1. Поскольку определенный функционал повторяется от проекта к проекту, я сразу себе сделал несколько заготовок и теперь постоянно их использую.

Простой пример динамического формирования данных:

module.exports = function() < var data = < users: [] >for (var i = 0; i < 1000; i++) < data.users.push( < id: i, name: 'userok' + i, age: i >) > return data; >

Пример использования json-server

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

npm install -g json-server
mkdir test-project touch data.json

Содержимое файла data.json:

< "posts": [ < "id": 1, "title": "json-server", "author": "typicode" >, < "id": 2, "title": "test!", "author": "Spider_NET" >, < "id": 3, "title": "test!", "author": "lord=of-fear" >], "comments": [ < "id": 1, "body": "some comment", "postId": 1 >] >
json-server data.json –w

Берем на заметку

Посмотреть полную документацию и внести при желании свою лепту в развитие проекта всегда можно через репозиторий на git hub.

Еще записи по теме

  • Пишем программу для подсчета трафика на Delphi
  • Возвращаюсь на блог
  • Если вы решили изучить JavaScript
  • Поиск циклических ссылок в 1С:Предприятие 8.3.10
  • Регулярные выражения в Delphi
  • Sails.js – фреймворк для ленивых. Пример простого баг трекера на sails.js
  • Доклад. Angular.JS – фреймворк для создания приложений на HTML/JS

json-server

Based on the example db.json , you’ll get the following routes:

GET /posts GET /posts/:id POST /posts PUT /posts/:id PATCH /posts/:id DELETE /posts/:id # Same for comments 
GET /profile PUT /profile PATCH /profile 

Params

Conditions

  • → ==
  • lt →
  • lte →
  • gt → >
  • gte → >=
  • ne → !=
GET /posts?views_gt=9000 

Range

GET /posts?_start=10&_end=20 GET /posts?_start=10&_limit=10 

Paginate

  • page
  • per_page (default = 10)
GET /posts?_page=1&_per_page=25 

Sort

  • _sort=f1,f2
GET /posts?_sort=id,-views 

Nested and array fields

  • x.y.z.
  • x.y.z[i].
GET /posts?author.name=foo GET /posts?author.email=foo GET /posts?tags[0]=foo 

Embed

GET /posts?_embed=comments GET /comments?_embed=post 

Delete

DELETE /posts/1 DELETE /posts/1?_embed=comments 

Serving static files

If you create a ./public directory, JSON Serve will serve its content in addition to the REST API.

You can also add custom directories using -s/—static option.

json-server -s ./static json-server -s ./static -s ./node_modules

License

This project uses the Fair Source License. Note: Only organizations with 3+ users need to contribute a small amount through sponsorship sponsor for usage. This license helps keep the project sustainable and healthy, benefiting everyone.

Создание фейкового REST API с помощью json-server-а

В этом уроке, с помощью json-server-а вы научитесь создавать и взаимодействовать с фейковым REST API, который будет полезен при разработке как мобильных, так и веб приложений. Данный урок предполагает, что у вас есть базовые знания о работе с форматом JSON и HTTP запросами.

Что такое REST?

REST — это сокращение от англ. Representational State Transfer (передача состояния представления). Это архитектурный стиль взаимодействия компонентов распределённых приложений. Он предназначен для взаимодействия множества устройств путём выполнения простых HTTP запросов. В результате этого пользовательские данные актуализируются не за счёт простого обращения к URL, а за счёт отправки разных видов HTTP запросов, таких как: GET, POST, DELETE и т.д. для достижения определённых целей.

К примеру, вместо GET обращения к URL вида /deleteuser?id=10 , запрос будет выглядеть так: DELETE /user/10 .

Зачем нам нужен фейковый REST API?

REST API может являться бэк-энд стороной любого мобильного или веб приложения. Зачастую во время разработки, REST API попросту не готов. Чтобы увидеть мобильное или веб приложений в действии вам потребуется сервер, которые будет возвращать случайные данные в формате JSON.

Вот тут-то нам и пригодится фейковый REST API. Инструмент json-server обладает набором нужного функционала, чтобы вы смогли без особых усилий настроить фейковый REST API сервер.

Начало работы

Чтобы начать работу с json-server вам потребуется его установить через Менеджер пакетов Node (npm).

npm install -g json-server

Создайте JSON файл в котором приведите пример требуемого формата возвращаемых данных. К примеру, мне потребуется JSON данные о пользователе: идентификатор, имя, расположение и т.д.. Я создам файл info.json со следующим JSON кодом:

"users": [ 
"id": 1, 
"name": "roy", 
"location": "india" 
"id": 2, 
"name": "sam", 
"location": "wales" 

Запускаем сервер через командную строку, указывая файл info.json в качестве источника данных REST API, доступных по адресу http://localhost:3000.

json-server info.json

Тестирование точек входа REST API

Теперь когда фейковый REST API сервер запущен давайте посмотрим как осуществить запрос, используя HTTP клиент. Для создания запросов к API я воспользуюсь инструментом Postman.

Запросы типа GET

Давайте начнём с создания GET запроса к REST URL. В созданном нами JSON файле мы определили точку входа под названием users , в которой соответственно хранится информация о пользователях. В результате выполнения GET запроса к URL http://localhost:3000/users мы должны получить список существующих данных.

"id": 1, 
"name": "roy", 
"location": "india" 
"id": 2, 
"name": "sam", 
"location": "wales" 

Запросы типа POST

Для того чтобы добавить новые данные к уже существующим необходимо совершить POST запрос к URL http://localhost:3000/users. POST запрос должен выглядеть следующим образом:

POST Request

После повторного выполнения GET запроса вы должны увидеть новые данные, которые были добавлены в файл info.json .

"id": 1, 
"name": "roy", 
"location": "india" 
"id": 2, 
"name": "sam", 
"location": "wales" 
"name": "ii", 
"location": "la", 
"id": 7 
"name": "Shona", 
"location": "LA", 
"id": 8 
"name": "Shona", 
"location": "LA", 
"id": 9 

Запросы типа DELETE

Для удаления данных из json-server , вам необходимо отправить DELETE запрос к соответствующей точке входа и передать идентификатор пользователя. К примеру, чтобы удалить пользователя с Id 1, вам необходимо отправить DELETE запрос по адресу http://localhost:3000/users/1. Чтобы убедиться что пользователь был удалён выполните GET запрос.

Запрос типа PATCH

Для того чтобы обновить уже существующую запись необходимо отправить PATCH запрос с указанием новых значений для уже существующей записи. К примеру, чтобы обновить пользователя с Id 2, отправьте PATCH запрос по адресу http://localhost:3000/users/2:

Patch Request

Организация поиска в json-server REST API

json-server REST API позволяет вам осуществить поиск данных, по определённым критериям. К примеру, чтобы найти всех пользователей по имени необходимо отправить GET запрос к REST API URL как это показано ниже:

Sending a GET request to the REST API URL

Согласно изображению представленном выше, отправка GET запроса к URL http://localhost:3000/users?name=Shona вернёт всех пользователей с именем Shona . Чтобы искать и по другим критериям необходимо добавить новые поля в строку запроса.

Для того чтобы осуществить полнотекстовый поиск по точке входа REST API, можете воспользоваться параметром q . К примеру, чтобы найти всех пользователей в информации о которых присутствует строка s , необходимо выполнить следующий запрос:

Full Text Search in json-server REST API

Работа с постраничным разбиением результатов

В случае работы с большим объёмом данных вам придётся столкнуться с информацией, распределённой по множеству страниц. json-server справится и с этой задачей, разбив JSON данные на множество частей. По умолчанию на одной странице json-server -а выводится порядка десяти записей. Данное значение можно подправить, используя параметр _limit .

http://localhost:3000/users?_limit=5

В результате выполнения GET запроса будет возвращено пять записей. Для того чтобы передвигать по страницам воспользуемся параметром _page . В _page необходимо указать номер страницы данные которой необходимо извлечь.

http://localhost:3000/users?_limit=5&_page=2

В результате выполнения GET запроса представленного выше, будет выведен список из пяти пользователей со второй страницы. Изменение параметра _page позволит нам получить данные с нужной страницы.

Сортировка результата

Также json-server позволяет осуществить сортировку результата. Для этого необходимо указать нужное поле и направление. По умолчанию данные сортируются в возрастающем порядке. Название сортируемой колонки необходимо указать в параметре _sort , а направление задать через ключевое слово _order . Пример подобного URL:

http://localhost:3000/users?_sort=id&_order=DESC

В этом примере сортировка будет осуществлена по колонке Id , в обратном порядке.

Работа с операторами

Вдобавок ко всему выше сказанному, json-server поддерживает работу с операторами, с помощью которых можно осуществить поиск по Id в определённом диапазоне или по регулярному выражению.

Для поиска записей в определённом диапазоне значений необходимо воспользоваться параметрами _gte и _lte . К примеру, чтобы найти пользователей чьи идентификаторы равны от 1 до 2, необходимо совершить GET запрос по URL http://localhost:3000/users?id_gte=1&id_lte=2:

Handling Less Than Greater Than Operators

Для поиска имён, начинающихся с определённой буквы необходимо воспользоваться регулярным выражением. К примеру, чтобы найти пользователей чьи имена содержат последовательность букв sa , воспользуемся оператором _like , который припишем к URL и отправим через GET запрос http://localhost:3000/users?name_like=^sa.

Handling Regular Expressions In Operators

Заключение

В этом уроке мы рассмотрели основы работы с json-server REST API для создания тестовой базы данных. Вы научились устанавливать json-server и взаимодействовать с URL для добавления, обновления, изменения и удаления данных. Также вы увидели как осуществить поиск по записям, используя операторы и регулярные выражения.

Доводилось ли вам пользоваться json-server -ом или каким-либо другим инструментом для генерации фейковых REST API? Есть подобный опыт? Вы всегда можете рассказать об этом в комментариях, расположенных ниже.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *