Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Node.js + React: é possivel chamar diretamente ou é preciso de um deploy

Olá a todos,

Criei uma API de login puxando informações de um banco mysql.

Esse é o código da minha API.

var express = require("express");
var bodyParser = require("body-parser");
var jwt = require("jwt-simple");
// var auth = require("./auth.js")();
var cfg = require("./config.js");
var mysql = require('mysql');
var app = express();
var md5 = require('crypto-md5');

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
// app.use(auth.initialize());
app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});


app.get("/", function(req, res) {
  res.json({status: "My API is alive!"});
});


// app.get("/user", auth.authenticate(), function(req, res) {
//   res.json(users[req.user.id]);
// });


app.post("/token", function(req, res) {


    const connection = mysql.createConnection({
      host     : '',
      user     : '',
      password : '',
      database : ''
    });


    connection.query("SELECT * FROM users", function(error, users, fields){

      if(error)
        res.json(error);
      else

      if (req.body.email && req.body.password) {

          var emailU = users.map(users => users.email);
          var password_md5U  = users.map(users => users.password_md5);

          var email = req.body.email;
          var password =  md5(req.body.password, 'hex');

          var user = ( emailU.includes(email) );

        if (user) {
          var payload = {id: user.id};
          var token = jwt.encode(payload, cfg.jwtSecret);
          res.json({token: token});
        } else {
          res.sendStatus(401);
        }
      } else {
          res.sendStatus(401);
      }

     connection.end();
    });



});

var port = process.env.PORT || 3001;

app.listen(port, function() {
  console.log("My API is running...");
});

module.exports = app;

Ele está funcionando sem problemas em localhost. Mas preciso dele para rodar minha app react.

Minha duvida, é possível chamar essa Api diretamente em uma app react ou preciso fazer um deploy e chamar a url?

*Desculpem se estou postando no lugar errado.

Obrigado.

2 respostas

Olá, Fellipe.

Você precisará que o seu código feito em React faça um requisição para sua API, essa é requisição que a galera chama de AJAX. A parte boa é que sua API já está pronta pra receber requisições de um outro domínio, porquê você já implementou o CORS:

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});
solução!

Ah! Outra coisa se você quiser usar a sua própria API pra servir o seu React é possível, só criar um rota e apontar isso para o código que você fez com React.

Eu não recomendo essa prática, porquê se sua API crescer, seu código de FrontEnd (React) estará junto com a da API, portanto deixará a manutenção tanto da API quanto do React um pouco menos feliz.

Recomendo você criar um BFF (Backend for FrontEnd) que será responsável em servir o seu código em React e um segundo projeto que fica responsável só sobre sua API