Только 1 из моих запросов Ax ios GET не будет работать внутри моего компонента React

Question

Я создаю базовое c приложение-задачу. Я создал собственный API для обработки запросов. В моем веб-приложении React / Redux я сделал много запросов к своему API, используя Ax ios. Все мои запросы сработали, за исключением одного, когда я пытаюсь получить задачи.

Вот серверный маршрутизатор для получения задач.

router.get('/tasks', auth, async (req, res) => {
    try {
        const tasks = await Task.find( {owner: req.user._id, project: req.body.project})
        tasks.length < 1 ? res.status(404).send('No tasks found for this project') : res.send(tasks)
    } catch (e) {
        res.status(500).send(e)
    }
})

Тогда вот запрос Ax ios, который я использую во внешнем интерфейсе.

axios({
      method: 'GET',
      url: '/tasks',
      headers: {
          authorization: token
      },
      data: {
          project: projectId
      }
  })
  .then(response => {
      console.log(response)     
  })
  .catch(error => {
      console.log(error)
})

Ниже приведен полный компонент React, в котором я вызываю действие Redux, которое содержит указанный выше запрос Ax ios. (PS Я занимаюсь рефакторингом - перемещаю все эти запросы Ax ios в Redux). Также имейте в виду, что независимо от того, в какой Компонент я вложил этот запрос, он не работает.

import React, { Component } from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'react-redux'
import axios from '../../../axios-orders'

import classes from './TaskManager.module.css'
import Tasks from '../../../components/Task/Tasks'
import Button from '../../../components/UI/Button/Button'
import * as actions from '../../../store/actions/index'



class TasksManager extends Component {
    state = {
        tasks: [],
        token: localStorage.getItem('token')
    }

    componentDidMount() { 
        this.props.fetchTasks(localStorage.getItem('token'), this.props.match.params.id) 
        
    }

    addTask = () => {
        axios({
            method: 'POST',
            url: 'tasks',
            headers: {
                authorization : this.state.token, 
            },
            data: {
                description: ' ',
                project: this.props.match.params.id
            }, 
            timeout: 1000
        })
        .then(res => {
            console.log(res)
            const newState = {...this.state}
            newState.tasks.push(res.data)
            this.setState({ tasks: newState.tasks })
        })
        .catch(e => console.log(e))
    }

    updateTextHandler = (event, id) => {
            const matchedTaskIndex = this.state.tasks.findIndex( t => t._id === id);
            const tasks = [...this.state.tasks]
            tasks[matchedTaskIndex].description = event.target.value
            this.setState({ tasks: tasks }) 
    }

    updateStatusHandler = (event, id) => {
        const matchedTask = this.state.tasks.findIndex(t => t._id === id)
        const tasks = [...this.state.tasks]
        tasks[matchedTask].completed ? tasks[matchedTask].completed = false : tasks[matchedTask].completed = true

        axios({
            method: 'PATCH',
            url: 'tasks/' + id,
            headers: {
                authorization : this.state.token
            },
            data: {
                completed: tasks[matchedTask].completed
            }
        })
        .then(res => {
            
            this.setState( {tasks: tasks} )
        })
        .catch(e => console.log(e))    
    }


    deleteTaskHandler = (event, id) => {
        axios({
            method: 'DELETE',
            url: 'tasks/' + id,
            headers: {
                authorization : this.state.token
            }
        })
        .then(res => {
            const matchedTaskIndex = this.state.tasks.findIndex( t => t._id === id);
            const tasks = [...this.state.tasks]
            tasks.splice(matchedTaskIndex, 1)
            this.setState({ tasks: tasks })
        })
        .catch(e => console.log(e))   
      }


    render() {
        let taskList = <div>Loading...</div>
        if (this.props.loading === true) {
            taskList = <Tasks 
                list={this.state.tasks} 
                updateText={this.updateTextHandler} 
                delete={this.deleteTaskHandler}
                updateStatus={this.updateStatusHandler}
                />
        }

        return (
            <div className={classes.Tasks}>
                <div className={classes.ListWrapper}>
                    <div className={classes.ButtonWrapper}>
                        <Button className={classes.Button} click={this.addTask}>Add Task</Button>
                    </div>
                    {taskList}
                </div>
            </div>
        )
    }
}

const mapStateToProps = state => {
    return {
        tasks: state.tasks.tasks,
        loading: state.tasks.tasksLoading
    }
}

const mapDispatchToProps = dispatch => {
    return {
        fetchTasks: (token, projectId) => dispatch(actions.fetchTasks(token, projectId))
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(withRouter(TasksManager))

Вот где это становится странным. Если я сделаю запрос GET через Ax ios из одного файла JS, он успешно получит все мои задачи. Однако, если я сделаю тот же запрос GET со всеми точно такими же данными, заголовками, URL-адресом и т. Д. c в компоненте React, я получу 404 и «Для этого проекта не найдено задач». И все мои другие запросы GET, POST, PATCH, DELETE работают в моем компоненте React. Я даже попытался жестко закодировать заголовки и данные, но это все еще не работает. Я попытался сделать запрос через действие Redux или непосредственно в компоненте в ComponentDidMount, но это не сработало. Я пробовал использовать в своем приложении разные компоненты React и вместо этого использовать UseEffect (), но это тоже не сработало.

Это была полная ломка головы. Заранее спасибо! Дайте мне знать, если вам понадобится дополнительная информация, чтобы помочь.