Проблемы с загрузкой файлов в Django из интерфейса React / Redux с помощью axios

Question

У меня есть проект django, настроенный с использованием response / redux на моем веб-интерфейсе, и мне нужно иметь возможность загружать несколько файлов с веб-интерфейса, которые читаются на сервере (не сохраняются в базе данных или что-либо еще), чтобы я мог может сделать некоторую обработку на стороне сервера. Тем не менее, я просто не могу получить файлы в обработчике запросов django. Я уверен, что это связано с моими заголовками или с тем, как я пытаюсь опубликовать это, но я прочитал, как и 30 других вопросов SO с похожими заголовками, и я не могу заставить себя работать.

У меня есть компонент FileUploader, который (кажется) позволяет мне загружать файлы и сохранять их в моем состоянии. Нажав кнопку загрузки, я ввожу ее в formData (как об этом говорят большинство источников django) и запускаю запрос на публикацию.

Компонент My React

export class FileUploader extends Component {
  static propTypes = {
    files: PropTypes.object.isRequired
  };

  fileSelectedHandler = event => {
    this.props.uploadFiles(event.target.files);
  };

  fileUploadHandler = event => {
    let formData = new FormData();
    formData.append("files", this.props.files);
    console.log(this.props.files);
    console.log("formData", formData);
    this.props.addSubmission(formData);
  };

  render() {
    return (
      <div className="file-uploader">
        <input type="file" multiple onChange={this.fileSelectedHandler} />
        <button onClick={this.fileUploadHandler}>Upload</button>
      </div>
    );
  }
}

const mapStateToProps = state => ({
  files: state.submissions.files
});

export default connect(
  mapStateToProps,
  { uploadFiles, addSubmission }
)(FileUploader);

Мой запрос на сообщение в моих редукционных действиях:

export const addSubmission = submission => dispatch => {
  axios
    .post("/api/submission_stats/add_submission/", submission)
    .then(res => {
      dispatch({
        type: ADD_SUBMISSION,
        payload: res.data
      });
    })
    .catch(err => console.log(err));
};

My Django Viewset:

class SubmissionStatsViewSet(viewsets.ModelViewSet):
    queryset = SubmissionStats.objects.all()
    permission_classes = [
        permissions.AllowAny
    ]
    serializer_class = SubmissionStatsSerializer

    @action(detail=False, methods=['post'])
    def add_submission(self, request, pk=None):
        #at this point, request.FILES is always empty

Я ожидаю, что смогу получить доступ к этим файлам в моем обработчике запросов django в атрибуте request.FILES. Однако это всегда пусто, хотя мои заголовки, кажется, отправляют formData. Я попробовал несколько других предложенных вещей, таких как добавление заголовка enctype = "multipart / form-data" или заголовка типа содержимого к моему сообщению axios. Я также пытался использовать нормальную форму и отказываться от реактивных / редукционных вещей, но я не смог заставить их работать. Я предполагаю, что это что-то довольно простое, потому что я не понимаю, почему загрузка файла не должна быть простой вещью, но я как бы напрягся и не могу понять это.