Блог

Используя загрузку файла, я попытался получить данные json.

Код загрузки файла :

 <input
        accept=".json" 
        id="contained-button-file"
        multiple
        type="file"
        onChange={ (e) => this.handleChange(e.target.files) }
      />
      <label htmlFor="contained-button-file">
        <Button variant="contained" color="primary" component="span">
          Upload
        </Button>
      </label>
  

обрабатывать функцию изменения

 handleChange(selectorFiles: FileList)
    {
           const fileReader = new FileReader();
            fileReader.readAsDataURL(selectorFiles[0]);
            fileReader.onload = (e) => { 
                var finResult =  e.target.result ;
                 
            };

}
  

но я получаю данные: application / json; base64, blob в консоли. вместо получения выходных данных json.

Вы используете readAsDataURL для чтения файла, который предоставляет вам URL-адрес данных (data: application / json и т.д.)

Попробуйте вместо этого использовать readAsText:https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsText `

 handleChange(selectorFiles: FileList) {
  const fileReader = new FileReader();
  fileReader.readAsText(selectorFiles[0]);
  fileReader.onload = (e) => {
    const contents = e.target.result;
    console.log(contents);
  };
}
  

Вы также можете использовать более новый File.text()

 selectorFiles[0].text().then(contents => {
  // do something with the contents of the file
});