如何使用 redux 和 express.js 正确发出 GET 请求

如何解决如何使用 redux 和 express.js 正确发出 GET 请求

我在使用 redux 和 express.js 发出 GET 请求时遇到问题。我需要将一些日期传递给后端，然后它会查询一些关于销售的报告。现在我已经使用了邮递员并且它可以工作并且它为我提供了我需要的数据，但是当我执行 redux 部分并尝试显示该数据时，它说“无法在 'Window' 上执行 'fetch': Request with GET/HEAD方法不能有体”。现在我知道我需要删除正文并将查询添加到 url，但是我该怎么办？我应该在哪里做？如果我需要修改前端和后端以获取查询，我感到很困惑。谁能帮我解决这个问题？ 这是我到目前为止所做的：

前端（Redux）[已编辑]

export const getCustomProfitReport = (startDate,endDate) => (dispatch) => {
    dispatch(customProfitReportLoading(true))

    const bearer = 'Bearer ' + localStorage.getItem('token')

    let params = {
        "param1": startDate,"param2": endDate
    }

    let query = Object.keys(params)
                .map(k => encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
                .join('&')

    return fetch(baseUrl + 'custom-profit-report?' + query,{
        method: 'GET',headers: {
            'Authorization': bearer
        }
    })
    .then(response => {
        if (response.ok) {
            return response
        }
        else {
            var error = new Error('Error ' + response.status + ': ' + response.statusText);
            error.response = response;
            throw error;
        }
    },error => {
        var errmess = new Error(error.message);
        throw errmess;
    })
    .then(response => response.json())
    .then(sales => dispatch(addCustomProfitReport(sales)))
    .catch(error => dispatch(customProfitReportFailed(error.message)))
}

这是后端（快递）

const express = require('express')
const bodyParser = require('body-parser')
const mongoose = require('mongoose')
var authenticate = require('../authenticate')
const cors = require('./cors')

const Sales = require('../models/sales')

const customProfitRouter = express.Router()

customProfitRouter.use(bodyParser.json())

customProfitRouter.route('/')
.options(cors.corsWithOptions,(req,res) => { res.sendStatus(200) })
.get(cors.cors,authenticate.verifyUser,authenticate.verifyAdmin,res,next) => {
    let start = req.params.startDate
    let end = req.params.endDate

    Sales.find({ 
        "createdAt": 
        { 
            $gte: start,$lte: end 
        } 
    })
    .populate('property')
    .populate('fee')
    .then((sales) => {
        res.statusCode = 200
        res.setHeader('Content-Type','application/json')
        res.json(sales)
    },(err) => next(err))
    .catch((err) => next(err))
})

module.exports = customProfitRouter

解决方法

编辑更新的问题

您应该从以下位置更改您的客户端代码：

{
  "main": "node_modules/expo/AppEntry.js","scripts": {
    "start": "expo start","android": "expo start --android","ios": "expo start --ios","web": "expo start --web","eject": "expo eject"
  },"dependencies": {
    "@react-native-community/masked-view": "^0.1.10","expo": "~40.0.0","expo-app-loading": "^1.0.1","expo-font": "~8.4.0","expo-status-bar": "~1.0.3","react": "16.13.1","react-dom": "16.13.1","react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz","react-native-gesture-handler": "~1.8.0","react-native-reanimated": "~1.13.0","react-native-safe-area-context": "^3.1.9","react-native-screens": "~2.15.0","react-native-svg": "12.1.0","react-native-svg-transformer": "^0.14.3","react-native-web": "~0.13.12","react-navigation": "^4.4.3","react-navigation-stack": "^2.10.2"
  },"devDependencies": {
    "@babel/core": "~7.9.0"
  },"private": true
}

到：

let params = {
    "param1": startDate,"param2": endDate
}

或更短的版本：

let params = {
    startDate: startDate,endDate: endDate
}

---

您不能发送具有正文的 let params = { startDate,endDate } 类型的提取请求。

有关如何将 GET 与查询参数结合使用，请参阅此 answer。
此外，在您的快速服务器端 - 从 fetch insted of req.params 获取参数 - 检查快速请求 documentation here

您可以在“获取”github issues page 上阅读有关该问题的更多信息。

,

解决方案是修改后端的一些行，将开始和结束替换为：

    let start = req.query.param1
    let end = req.query.param2  

稍微修改一下就可以了..希望对某人有所帮助！