Question

设置参数并按下按钮后，expressjs请求将接收到请求[Node request package]或获取请求。创建链接地址后，返回的响应为400 Bad Request。

我已经尝试了获取请求和节点包'request'和

服务器JS

    const express = require ('express');
    const path = require('path') //core node module
    const app = express();
    const cors = require('cors');
    const router = express.Router();

    // app.use(cors())
    const publicdirpath = path.join(__dirname, '../public')
    console.log(path.join(__dirname, '../public'))

    app.use(cors());
    app.use(express.static(publicdirpath))

    app.post('/testcall', (req, res) => {
        if(!req.query.startdate && !req.body.enddate && 
    !req.body.projectnumber){
        return res.status(400).send({
            success: 'false',
            message: 'dates or project or both required'
        });
     }

     //call stored procedures
   });

    const port = process.env.PORT || 3000;
    app.listen(port, () => {
    console.log(`Server running on port ${port}`);
   });

调用快速JS的JS类


    handleDropdownClick = (event, selection) =>{
        const { name, innerText, value } = event.target;
        console.log( event.target  + " : " + innerText + " : " + 
    this.props.formData);
        const request = require('request');
        switch(selection){
            case 1:
                //call api or stored procedure 
                if(this.validation()){
                    //call api
                 request.get({url:"http://localhost:3000/testcall", qs:this.state.formData} , function (err, res, body) {
                        if(err){
                            console.error('error with request: error: ' + err + '. res: ' + res +  ' + body: ' + body);
                        }
                        console.log("Get response: " + res.statusCode + ". Body: " + body);

                    })

                    //Using Fetch
                    const jsonData = JSON.stringify(this.state.formData);
                    fetch('/testcall', {
                        method: "POST",
                        headers: {
                            'Accept': 'application/json',
                            'Content-Type': 'application/json',
                            'credentials': 'include'
                        },
                        body: jsonData
                    })
                    .then( response => { 
                        return response.json();
                    })
                    .then( response => {
                        console.log(response);
                    })
                    .catch(function (e) {
                        console.log("fail: " + e);
                    })
                }
                break;
    //more code

Package.json

    {
      "name": "app-name",
      "version": "0.1.0",
      "private": true,
      "main": "index.js",
      "dependencies": {
      "body-parser": "^1.19.0",
      "cors": "^2.8.5",
      "express": "^4.17.1",
      "nodemon": "^1.19.1",
      "react": "^16.8.6",
      "react-dom": "^16.8.6",
      "react-scripts": "3.0.1",
      "request": "^2.88.0",
      "save": "^2.4.0",
      "semantic-ui-react": "^0.87.2",
      "table": "^5.4.1",
      "tedious": "^6.2.0",
      "webpack": "^4.29.6"
     },
    "scripts": {
      "start": "react-scripts start",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "eject": "react-scripts eject",
      "dev": "run-p server start"
    },
    "eslintConfig": {
      "extends": "react-app"
    },`enter code here
    "browserslist": {
      "production": [
        ">0.2%",
        "not dead",
        "not op_mini all"
      ],
      "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
      ]
    }, 
    "proxy":"http://localhost:3000"
  }

Index.js

    import React from 'react';  
    import ReactDOM from 'react-dom';
    import './index.css';
    import App from './App';
    import * as serviceWorker from './serviceWorker';


    ReactDOM.render(<App />, document.getElementById('root'));

    serviceWorker.unregister();

文件路径

public
src
 -api
 -components
 -storedprocedures
 -tabs
 -app.js
 -config.js
 -index.js
 -server.js
package-lock.json
package.json

expressjs预期的结果将是接受调用并完成逻辑。

实际结果是：

POST http://localhost:3000/calculatecommission 400（错误请求） -用于npm软件包请求

request.js：149 GET http://localhost:3000/calculatecommission?projectnumber=&startdate=2019-06-02&enddate=2019-06-28 400（错误请求） -获取请求

Answer 1

您可以使用 axios 或在前端使用代理

Answer 2

我也建议您使用Axios，使用起来比获取容易得多。您可以在此处找到更多信息

https://alligator.io/react/axios-react/

Answer 3

不幸的是，使用axios获得了相同的结果。我想知道问题是否在于快递服务器文件设置错误。也许根本没有收到请求。

React Project-对ExpressJS Server的请求返回400-错误的请求

3 个答案: