1

我的 API 有问题。当我使用 ReactJS 中的 fetch 将 un json 发送到 NodeJS 服务器时，服务器崩溃了......

获取调用：

 const jso = JSON.stringify({
        username: this.state.username,
        password: this.state.password
      })
      fetch("URL/authentication", {
        method: 'POST',
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json'
        },
        body: jso,
      }).then(res => res.json()).then((result) => {
        this.setState({
          answer: result.answer
        })

      }, (error) => {
        this.setState({isLoaded: true, error});

      })
  }

这是后端

var express = require('express');
var app = express();
var cors = require('cors');
var bodyParser = require('body-parser')
var mysql = require("mysql");

//Enabeling all Access-Control-Allow-Origin
app.use(cors());
app.options('*', cors())

var port = process.env.PORT || 5000

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

//omitted mysql connections details

app.post('/authentication', (req, res) **=> {
    email = req.body.username,
    password = req.body.password,
    matching = "false"
    var dbpassword

    sql = "SELECT password FROM users WHERE email = ?";
    db.query(sql, email, (err, result, fields) => {
        if(err) {
            console.error('error query: ' + err.stack)
            return;
        }
        dbpassword = result[0].password;

         if(dbpassword === password){
        matching = "true";
        console.log(dbpassword + " : " + password);
        } 
        res.send({answer: matching});

    });
})

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

问题是，每次我从前端发出请求时，这都会使我的服务器（托管在 Heroku 上）崩溃......

但是，当我尝试从前端删除标头部分时，服务器不会崩溃但不会返回任何内容......

查看日志后，我发现，当 fetch 的标头部分带有 时'Content-Type': 'application/json'，它会在 post 请求之前发送一个 OPTIONS 请求...

我的问题：我怎样才能使它起作用？我尝试了邮递员的发布请求并且它有效，所以我知道我的服务器/算法不是问题。另外，后端的服务器是 Heroku

4

2 回答 2

1

因为您在 express 服务器中启用了 CORS，所以您需要修改您的 fetch 调用。
添加参数mode: cors

fetch("URL/authentication", {
    method: 'POST',
    mode: 'cors', // defaults to same-origin
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      username: this.state.username,
      password: this.state.password
    })
  })

有关更多信息，请查看Fetch API 文档
请注意，如果您在 localhost 上运行它会正常工作，但由于它托管在其他地方，因此会导致错误。

于 2018-10-02T23:26:50.393 回答
0

当我的前端没有发送任何请求时，我忘了处理......

这可能并不完美，但它正在工作：

app.post('/authentication', (req, res) => {
    email = req.body.username,
    password = req.body.password,
    matching = "false"
    var dbpassword

    if(email!=""){

        sql = "SELECT password FROM users WHERE email = ?";
        db.query(sql, email, (err, result, fields) => {
            if(err) {
                console.error('error query: ' + err.stack)
                return;
            }
            if(result.length > 0){
                dbpassword = result[0].password;

                if(dbpassword === password){
                matching = "true";
                console.log(dbpassword + " : " + password);
                } 
            }

            res.send(JSON.stringify({answer: matching}));
        });
    }

    else res.send(JSON.stringify({answer: matching}));
})
于 2018-10-03T03:15:20.127 回答