Это было несколько месяцев назад, когда я поднял основы веб-разработки, изучая HTML, CSS & JavaScript и познакомился с библиотеками, такими как Bootstrap 4.0 и jQuery.
Теперь следующим шагом было перейти к бэкэндской стороне веб-разработки. Поскольку я уже выучил JavaScript, я рассмотрел изучение Nodejs с Express. На начальном этапе моего обучения вещи вылетели над моей головой, особенно часть запросов Get & Post. Но для возвращения я сделал очень простой калькулятор как мой проект. И это было отличное обучение таким образом. Быстрое руководство по моему Простое проект:
Начните с создания двух файлов по имени, скажем: Calculator.html & server.js в каталоге.
Сейчас сначала мы будем кодировать основную структуру нашего HTML-файла с помощью HTML Boaterplate, как показано на рисунке.
- Добавьте теги ввода и тега кнопки внутри тега формы в корпусе файла HTML, как показано на рисунке.
Вы можете заметить два атрибута в теме форма I.e «Действие» и «Метод», они будут объяснены в предстоящих точках.
При этом HTML-часть выполняется, и теперь мы перешли на наш файл Server.js.
Важно знать Что именно сервер ? Простые слова, когда вы (будут называться как клиент ) Поиск любого запроса в вашем веб-браузере Ваш запрос плавает через Интернет и достигает порога Сервер Создание запроса (другими словами, ваш браузер делает получить запрос на сервер), к которому сервер отвечает Что касается желаемых результатов, которые возвращаются к вам через ваш браузер плавать снова:). Серверы расположены в центрах данных по всему миру.
Перед переходом в файл JS вы должны убедиться, что у вас есть инициализированные узел пакета Manager AKA NPM и у Node.js установлен на ПК. Следуйте ниже фрагментах в вашем терминале, чтобы инициализировать NPM :
cd
npm init
npm install express body-parser
Теперь вы хотите идти!
Возвращаясь к нашему файлу JS, теперь мы должны импортировать наши пакеты, а именно Экспресс & Тело-парсер что мы установили через NPM Отказ .
Теперь мы создадим локальный сервер на вашем компьютере, как показано на рисунке.
После сохранения файла JS вы должны ввести следующее в терминале:
node server.js
Это начнет работать на сервере на порт 3000. Вы увидите заметку, появившись в вашем терминале, указав Порт создан Отказ Проще говоря, вы создали сервер, который имеет адрес localhost: 3000 Отказ Ваш браузер сделает запрос на этот порт локально И тогда ваш локальный сервер будет сделан, чтобы ответить на запрос.
Теперь откройте свой браузер и введите localhost: 3000 в вашем поиске. Вы можете получить уведомление из браузера AS Не может получить/ , это потому, что когда запрос сделан браузером, сервер не имеет никакого файла для рендера.
Примечание. Возможно, вам, возможно, придется перезапустить свой сервер (I.E выйти из сервера, используя команду Ctrl + C и запустите файл Server.js через узел снова) каждый раз, когда вы вносите какие-либо изменения в вашем сервере. Чтобы избежать этого хлопота, вы можете установить пакет Nodemon by:
npm install -g nodemon
Чтобы запустить Nodemon вместо узла:
nodemon server.js
- Теперь, чтобы сделать ваш HTML-файл, в Server.js мы бы включали:
Символ «/» представляет ваш домашний маршрут. Вспомните, что в нашем HTML-файле мы поместили наш атрибут действий в тег виде, равных «/». У вас могут быть разные маршруты, такие как «/о» или «/контакт». Предположим, вы создаете маршрут «/о», затем для доступа к маршруту вам придется поиск: localhost: 3000/о
Следовательно, когда вы ищете, ваш браузер делает запрос на ваш сервер в Localhost, а затем ваш сервер отображает HTML-файл. Следовательно, теперь вы можете соотноситься, почему мы получали Не может получить/ ошибка.
Теперь, когда вы даете ввод и нажмите кнопку «Отправить», вы получите Не может опубликовать/ ошибка. Это потому, что наши не создали ответ на нашем Server.js.
- Мы должны нажать на отдельные кусочки данных или в нашем HTML, мы используем тело-парсер.
- Теперь мы должны написать логику нашего кода, используя отдельные части данных внутри нашего тега. Мы бы написали логику простого дополнения между двумя числами. Тогда мы опубликовали результат на нашем домашнем маршруте, так как это маршрут, в котором мы даем наш вклад в текущий сценарий.
С этим мы успешно создали базовый сервер Backend, который может выполнять запросы Get/Post. По простым словам, Get используется для получения информации, а пост используется для выдвижения информации.
Я надеюсь, что эта простая статья о запросе Get/Post была хорошей прочтой!
Оригинал: “https://dev.to/surajv/an-insight-to-get-post-requests-in-nodejs-d8a”