Как передать информацию о состоянии реагирования DOM бэкэнду (NodeJS) при вызове кнопки? - PullRequest
Новая
       24

Как передать информацию о состоянии реагирования DOM бэкэнду (NodeJS) при вызове кнопки?

0 голосов
/ 08 мая 2018

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

handleSubmit = () => {
    // Gathering together the data you want to send to API
    const payload = {
        subject: this.state.subject,
        message: this.state.message,
    };
    this.handleAjaxRequest(payload);
};

// Метод отправки данных на сервер // Делаем req -Я использую Axios здесь. 

handleAjaxRequest = (payload) => {
    let request = axios({
        method: 'post',
        url: '/api/',
        data: payload,
        headers: 'Content-Type: application/json'
    });

// Делать вещи с ответом от вашего бэкэнда. 

    request.then(response => {
        console.debug(response.data);
    })
    .catch(error => {
        console.error(error);
    })
};

Раньше я делал это с помощью Express, и у меня не было таких проблем. Любая помощь, метод, предложение приветствуется:)

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

1 Ответ

0 голосов
/ 24 июня 2018

Хорошо, первое, что мне нужно было сделать, это сгенерировать новый restful API с помощью команды sails generate api data. В файле package.json я настроил прокси-сервер, который включает конечную точку бэкэнда, как это "proxy": "http://localhost:1337" - я имею в виду, вам не нужно это делать, но если вы этого не сделаете, то вам нужно включить эту часть URL в каждый запрос. Поскольку это не меняется, это довольно удобно.

На интерфейсе я создал функцию sendData(), которая берет необходимые данные из моего предыдущего компонента (в зависимости от того, что выбрал пользователь) и отправляет эти данные с помощью axios на бэкэнд -> 

sendData = () => {
                const { relYear } = this.props.history.location.state.dev;
                const { relMonth } = this.props.history.location.state.dev;
                const selectedMonth = moment().month(relMonth).format("MM");
                const finalSelect = parseInt(relYear + selectedMonth, 10);


                axios.post('/data', { 'selectedDate' : finalSelect })
                    .then(res => console.log('Data send'))
                    .catch(err => console.error(err));
                }

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

getApiData = () => {
            let apiData = [];
            axios.get('/data')
            .then(res =>  {
            let first = Object.values(res.data.pop()).shift();    // Getting the relevant 'selectedDate'
            apiData.push(first);
            }).catch(err => console.error(err));
            return apiData;            
        }
...