Как загрузить файл React js web api не работает - PullRequest
Новая
       35

Как загрузить файл React js web api не работает

0 голосов
/ 18 марта 2020

Я работаю над загрузкой файлов React с помощью веб-API. После загрузки файла сервер показывает, что

null., ............................. ..................................... 

import React, { PropTypes } from 'react';
import axios from 'axios';
class Dashboard extends React.Component {

    constructor(props){
        var files;
        super(props);
        this.state =  {
            selectedFile: null
}
}
fileChangedHandler = event => {
        this.setState({
            selectedFile: event.target.files[0]
          })
          var file = this.refs.file.files[0].name;
          let reader = new FileReader();
        reader.onloadend = () => {
        this.setState({
            imagePreviewUrl: reader.result
        });
        }

         reader.readAsDataURL(event.target.files[0])
    }
 async submit(e){
      e.preventDefault();

      await this.addImage(this.state.selectedFile);
    };

    addImage = async (file) => {
      console.log(this.state.selectedFile);
      await fetch('http://localhost:32188/Api/Authenticate/Uploadfile',
          {
              method: 'POST',
               mode: 'cors',
              headers: {
                   'Content-Type': 'application/json',
                   'Accept': 'application/json'
              },
              body: this.state.selectedFile

          }
      )
  }

 render() {

 <form onSubmit={e => this.submit(e)} enctype="multipart/form-data">
                                      <input   ref="file"   type="file"   name="user[image]"  onChange={this.fileChangedHandler}    style={{padding: '5px', marginLeft: '31px'}} />



                                      <div className="signin_form_button">
                                            <input type="submit" value="Upload"  className="signin_form_buttonstyle" />
                                        </div>
                                   </form>
}

}

Серверный код

Модель 

public class ImageModel
{

  public IFormFile File { get; set; }
}

Контроллер 

[System.Web.Http.Route("Api/Authenticate/Uploadfile")]
[System.Web.Http.HttpPost]
public void CreateImage([System.Web.Http.FromBody] ImageModel model)
{
  var file = model.File;
}

Отображается следующее сообщение об ошибке

500 Внутренний сервер Произошло сообщение об ошибке: «Произошла ошибка». ExceptionMessage: «Ссылка на объект не установлена ​​для экземпляра объекта.»

Пожалуйста, помогите.

Ссылка: https://codesandbox.io/s/vigorous-mestorf-osf90

...