Блог

Главная - Вопросы по программированию - Вызов узла / Axios из интерфейса

Вызов узла / Axios из интерфейса

#javascript #node.js #express #axios #ejs

#javascript #node.js #экспресс #axios #ejs

Вопрос:

У меня есть приложение NodeJS / Axios / Express, над которым я работаю. Я написал интерфейс, используя express, и у меня есть форма, которую я хочу иметь возможность использовать для отправки данных в функцию, использующую axios. Когда я пытаюсь запустить его, я получаю сообщение об ошибке, которое не определено require. Как я смогу отправить форму и передать данные в мою функцию для выполнения?

Я использую EJS, поэтому некоторые HTML-файлы могут выглядеть как его недостающие части, потому что это часть другого файла.

Вот одна из функций. Он работает правильно, если я выполняю его с помощью кода order_handler.js

 const axios = require('axios');
const helper = require('../helper_functions');
const qs = require('qs');
const session = require('./get_login');

async function getProdData(slug) {
var sessionid = await session.initSession('<username>', '<password>');

var config = {
    headers: {
        'User-Agent':   'Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0',
        cookie: `sessionid=${sessionid.sessionCookie}; _gat=1`,
    },
}

return axios.get('<3rd party API>'   slug   '/?format=json',config)
.then(res => {
    var data = res.data;
    console.log(data);
})
.catch(err => {
    console.error(err); 
})
}

Вот HTML-форма на интерфейсе:

 <script src="./order_handler.js"></script>
<form action="#" method="POST">
<div class="form-group">
  <label for="sku">Item Lookup by SKU</label>
  <input
    type="text"
    id="text"
    name="Item SKU"
    class="form-control"
    placeholder="Enter SKU"
  />
</div>
<button type="submit" onsubmit="getProductData()" class="btn btn-primary btn-block">Find</button>
</form>

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

Комментарии:

1. require не может использоваться во внешнем интерфейсе, если вы не используете какой-то пакет ресурсов, например Webpack. Веб-браузер изначально не поддерживает require.

2. Итак, без использования webpack было бы решением написать мои внутренние функции таким образом, чтобы предоставлять API, в который я мог бы отправлять сообщения из интерфейса?

3. Это зависит от того, хотите ли вы выполнять вызовы AJAX, или если вы сталкиваетесь с отправкой данных и обработкой перенаправлений. Вы можете настроить маршрут, по которому форма отправляет данные формы, а затем ваш внутренний маршрут обрабатывает данные, а затем перенаправляет пользователя на другую страницу.

4. Я бы предпочел использовать вызовы AJAX, чтобы страница не перезагружалась и могла возвращать данные из функции.

5. Самым безопасным вариантом было бы использовать JavaScript, который понимает ваш браузер, для выполнения ваших запросов ajax. Это означало бы, что никаких требований не требуется, и ваши запросы api будут использовать выборку вместо axios.