Реализация называется отдых на Гэтсби - PullRequest
Новая
       5

Реализация называется отдых на Гэтсби

0 голосов
/ 10 февраля 2020

У меня вопрос по приведенному ниже коду. Мне нужно сделать оставшийся вызов маршрутизатору с помощью gatbsy. js, чтобы сделать это, я использую приведенный ниже код, чтобы нажать на форму. параметры, внутренний сервер выполнен в node.js и уже использует express. js, я проверил роутеры с почтальоном и приложение, написанное для ios, делая остальные вызовы, и никаких проблем не возникает, как можно Я go о том, как правильно позвонить в Гэтсби. js?

Внешний интерфейс:

index. js

import React from "react";
import { Link } from "gatsby";
import server from "./setup.js";
import Layout from "../components/layout";
import SEO from "../components/seo";

//Variabile che rappresenta il router per la registrazione al server
var loginaddress=server.server+"/login";

//Pagina di registrazione
const NuovoPage = () => (

  <Layout>
    <SEO title="Registrazione" /> 

    <form method="POST" action={loginaddress}>
    Email:    <input type="text"  name="Email" /> <p></p>
    Password: <input type="password"  name="Password" /> <p></p>
   <br></br>
    <input type="button" value="Registrazione" />
    <p></p>
    </form>
    <Link to="/">Ritorna alla homepage</Link>
  </Layout>
)

//Esporto la pagina della pagina di registrazione
export default NuovoPage

настройка. js

var server="http://localhost:8787";

module.exports.server = server;

Серверная часть: 

const express = require("express");
const myParser = require("body-parser");
const app = express();
    app.post("/login", async function (request, response) {

        var ret = 0;
        try {
            console.log("\n" + request.body.Email + " sta cercando di effettuare il login");
            ret = await UserController.Login(request.body.Email, request.body.Password);
        } catch (err) {
            console.log("Errore: " + ret + "\n err: " + err);
            ret = 0;
        }
        response.setHeader('Content-Type', 'application/json');
        response.send(JSON.stringify({
            return: ret
        }));

    });

Ответы [ 2 ]

0 голосов
/ 11 февраля 2020

Взгляните на страницу MDN для Ввод

Как работает <input>, значительно варьируется в зависимости от значения его атрибута типа, поэтому рассматриваются различные типы в своих отдельных справочных страницах. Если этот атрибут не указан, принятым типом по умолчанию является text.

Доступны следующие типы:

  • кнопка: кнопка pu sh с нет поведения по умолчанию при отображении значения атрибута value, по умолчанию пустое.

  • submit: кнопка, которая отправляет форму.

  • .. .

Поэтому, если вы измените свой input на type из submit, пользовательский агент попытается отправить форму на сервер, когда происходит событие click. происходит (как правило, потому что пользователь нажал кнопку). 

<form method="POST" action={loginaddress}>
  Email:    <input type="text"  name="Email" />
  Password: <input type="password"  name="Password" />
  <input type="submit" value="Registrazione" />
</form>
0 голосов
/ 11 февраля 2020

Вы хотите отправить HTTP-запрос в свой код React. Топор ios - самый популярный способ сделать это. Здесь хороший учебник, как это сделать:

Ваш тег формы: 

        <form onSubmit={this.handleSubmit}>
            {/* ... */}
          <button type="submit">Registrazione</button>
        </form>

Функция HandleSubmit: 

  handleSubmit = event => {
    event.preventDefault();

    axios.post(`https://http://localhost:8787/login`, { yourData })
      .then(res => {
        console.log(res);
        console.log(res.data);
      })
  }
...