POST http://localhost:3000/signin 400 (Bad Request) in react

约夫

我正在尝试将来自 SignIn.js 中用户输入的请求连接到 server.js,它向我发送了“signin:1 POST http://localhost:3000/signin 400 (Bad Request)”的错误,当我想尝试在 Postman 上发送一个 json,它可以工作。

我也得到:

events.js:174
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRINUSE: address already in use :::3000
    at Server.setupListenHandle [as _listen2] (net.js:1277:14)
    at listenInCluster (net.js:1325:12)
    at Server.listen (net.js:1412:7)
    at Function.listen (C:\Users\zehav\final-project\node_modules\express\lib\application.js:618:24)
    at Object.<anonymous> (C:\Users\zehav\final-project\server.js:72:5)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
Emitted 'error' event at:
    at emitErrorNT (net.js:1304:8)
    at process._tickCallback (internal/process/next_tick.js:63:19)
    at Function.Module.runMain (internal/modules/cjs/loader.js:745:11)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)

我应该怎么办?谢谢你!

------server.js-------

const express = require('express');
const bodyParser = require('body-parser');
const bcrypt = require('bcrypt');
const cors = require('cors');


const app = express();
app.use(cors());
app.use(bodyParser.json());

const database = {
    users: [
        {
            id: '123',
            name: 'tal',
            email: '[email protected]',
            password: '123'
        }
    ]
}


app.post('/signin', (req, res) =>
{
    bcrypt.hash(req.body.password, 10, function(err, hash) {
        console.log(hash);
      });
      console.log(req.body.email)
      console.log(req.body.password)

    if ((req.body.email === database.users[0].email) && (req.body.password === database.users[0].password)) {
        res.json('success');
    } else {
        res.status(400).json('error logging in')
    }
})

app.listen(3000, () => {console.log("app is running...")});

--------登录.js--------

import React, {Component} from 'react';
import './SignIn.css';

class SignIn extends Component {

  constructor(props){
      super(props);
      this.state= 
      {username: '',
      password: ''
      }
  }

onUserNameChange = (event) => {
this.setState({username: event.target.value});
console.log(this.state);
}

onPasswordChange = (event) => {
this.setState({username: event.target.value});
console.log(this.state);
}

onSubmitSignIn = () => {

  fetch('http://localhost:3000/signin', {
    method: 'post',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify(({
      email: this.state.username,
      password: this.state.password
    }))
  }).then( response => response.json()).then(data => {
    if (data === 'success'){
      this.props.onRouteChange('home');
    }
  })
}

    render () {
    return (
        <div id="parent">
        <div className="ui-link-card">
        <div className="ui form segment">
          <div className="field">
            <label className="headers">Username</label>
            <div className="ui left labeled icon input">
              <input className="headers" type="text" placeholder="username" onChange={this.onUserNameChange}/>
              <i className="user icon"></i>
              <div className="ui corner label">
                <i className="icon asterisk"></i>
              </div>
            </div>
          </div>
          <div className="field">
            <label className="headers">Password</label>
            <div className="ui left labeled icon input">  
              <input className="headers" type="password" placeholder="password" onChange={this.onUserNameChange}/>
              <i className="lock icon"></i>
              <div className="ui corner label">
                <i className="icon asterisk"></i>
              </div>
            </div>
          </div>
          <div className="ui error message">
            <div className="header">We noticed some issues</div>
          </div>
          <div id="loginBtn" className="ui blue submit button" onClick={this.onSubmitSignIn}>
          Login
          </div>
              </div>
          </div>
          </div>
    );
  }
  }

    export default SignIn;
希瓦姆苏德

EADDRINUSE是当您尝试Node在同一端口上运行多个服务器时遇到的错误如果你找不到进程或者它在后台运行,试试这个命令Windows CMD

C:\>netstat -ano | find "LISTENING" | find "3000"

输出的第五列是进程 ID:

TCP    0.0.0.0:3000           0.0.0.0:0              LISTENING       14828
TCP    [::]:3000              [::]:0                 LISTENING       14828

然后你可以像这样终止进程taskkill /pid 14828

现在你的第二个错误看起来很好,我只是发现在你的body参数中你有一对额外的括号。这是固定版本

onSubmitSignIn = () => {

fetch('http://localhost:3000/signin', {
method: 'post',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
  email: this.state.username,
  password: this.state.password
})
  }).then( response => response.json()).then(data => {
if (data === 'success'){
  this.props.onRouteChange('home');
  }
 })
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Unity 在 SAP Rest API 上调用 HTTP-Post 时发生 400 Bad Request

来自分类Dev

身份验证POST http:// localhost:3000 / api / users / register 400(错误请求)MERN应用

来自分类Dev

码头在格式不正确的HTTP POST标头上返回“ HTTP / 1.1 400 Bad Request”。这是预期的吗?

来自分类Dev

码头在格式不正确的HTTP POST标头上返回“ HTTP / 1.1 400 Bad Request”。这是预期的吗?

来自分类Dev

意外错误400:Bad Request HttpBuilder POST Request

来自分类Dev

从 Json 页面抓取网页但 HTTPError: HTTP Error 400: Bad Request

来自分类Dev

POST http:// localhost:3000/404(未找到)

来自分类Dev

烧瓶socketio 400(BAD REQUEST)

来自分类Dev

烧瓶socketio 400(BAD REQUEST)

来自分类Dev

@PathVariable 给出 400 Bad Request

来自分类Dev

Exception Value: HTTP Error 400: Bad Request after a Python/urllib2 request to PayPal Sandbox Site

来自分类Dev

POST http:// localhost:3000 / socket.io /?EIO = 3&transport = polling&t = NQUneY3 400(错误请求)在ejs和nodejs中

来自分类Dev

http:// localhost:3000 / api / stuff的Http失败响应:400错误的请求

来自分类Dev

如何修复 .Net Core POST 操作中的 400 Bad Request 错误?

来自分类Dev

如何访问 Microsoft 认知 API(HTTPError: HTTP Error 400: Bad Request)

来自分类Dev

AutoValidateAntiforgeryToken 总是导致 400 Bad Request 返回

来自分类Dev

在 React 中将所有内容放在 http://localhost:3000/app 而不是 http://localhost:3000/ 下的最简单方法

来自分类Dev

GET http:// localhost:3000/404(未找到),实际上是在拨打POST却获得GET

来自分类Dev

禁用“ 400 Bad Request”错误,因为表单中缺少键

来自分类Dev

如何自定义响应Error 400 Bad Request

来自分类Dev

在Flask中发布json时显示“ 400 Bad Request”

来自分类Dev

使用Python Socket GET请求获取400 Bad Request错误

来自分类Dev

Windows client damage authorization header (Kerberos) => IIS 400 (Bad Request)

来自分类Dev

使用 urllib 时出现 400 Bad Request HTTPError 异常

来自分类Dev

AJAX POST请求中的HTTP错误400

来自分类Dev

$http post 方法的 400 错误请求

来自分类Dev

C++ Http POST 400 错误请求

来自分类Dev

react-full-page会阻止我的页面以特定ID(例如http:// localhost:3000 /#someIdWhereIWantThePageToBeOpened)打开

来自分类Dev

我如何用 Flask 和 jquery 解决这个问题?HTTP400: BAD REQUEST - 由于语法无效,服务器无法处理请求

Related 相关文章

  1. 1

    Unity 在 SAP Rest API 上调用 HTTP-Post 时发生 400 Bad Request

  2. 2

    身份验证POST http:// localhost:3000 / api / users / register 400(错误请求)MERN应用

  3. 3

    码头在格式不正确的HTTP POST标头上返回“ HTTP / 1.1 400 Bad Request”。这是预期的吗?

  4. 4

    码头在格式不正确的HTTP POST标头上返回“ HTTP / 1.1 400 Bad Request”。这是预期的吗?

  5. 5

    意外错误400:Bad Request HttpBuilder POST Request

  6. 6

    从 Json 页面抓取网页但 HTTPError: HTTP Error 400: Bad Request

  7. 7

    POST http:// localhost:3000/404(未找到)

  8. 8

    烧瓶socketio 400(BAD REQUEST)

  9. 9

    烧瓶socketio 400(BAD REQUEST)

  10. 10

    @PathVariable 给出 400 Bad Request

  11. 11

    Exception Value: HTTP Error 400: Bad Request after a Python/urllib2 request to PayPal Sandbox Site

  12. 12

    POST http:// localhost:3000 / socket.io /?EIO = 3&transport = polling&t = NQUneY3 400(错误请求)在ejs和nodejs中

  13. 13

    http:// localhost:3000 / api / stuff的Http失败响应:400错误的请求

  14. 14

    如何修复 .Net Core POST 操作中的 400 Bad Request 错误?

  15. 15

    如何访问 Microsoft 认知 API(HTTPError: HTTP Error 400: Bad Request)

  16. 16

    AutoValidateAntiforgeryToken 总是导致 400 Bad Request 返回

  17. 17

    在 React 中将所有内容放在 http://localhost:3000/app 而不是 http://localhost:3000/ 下的最简单方法

  18. 18

    GET http:// localhost:3000/404(未找到),实际上是在拨打POST却获得GET

  19. 19

    禁用“ 400 Bad Request”错误,因为表单中缺少键

  20. 20

    如何自定义响应Error 400 Bad Request

  21. 21

    在Flask中发布json时显示“ 400 Bad Request”

  22. 22

    使用Python Socket GET请求获取400 Bad Request错误

  23. 23

    Windows client damage authorization header (Kerberos) => IIS 400 (Bad Request)

  24. 24

    使用 urllib 时出现 400 Bad Request HTTPError 异常

  25. 25

    AJAX POST请求中的HTTP错误400

  26. 26

    $http post 方法的 400 错误请求

  27. 27

    C++ Http POST 400 错误请求

  28. 28

    react-full-page会阻止我的页面以特定ID(例如http:// localhost:3000 /#someIdWhereIWantThePageToBeOpened)打开

  29. 29

    我如何用 Flask 和 jquery 解决这个问题?HTTP400: BAD REQUEST - 由于语法无效,服务器无法处理请求

热门标签

归档