最近在使用js上传文件到ipfs上，于是按照教程，自己在本地搭建了一个ipfs节点，上传文件端口是5001，查看文件端口是8080，但是代码写完之后，在自己本机节点测试，上传文件功能实现，使用本机测试节点http://127.0.0.1:8080/ipfs/:hash可以访问到该文件，但是在https://ipfs.io/ipfs/:hash下经常访问不到（有时可以访问到，但是不是立刻，有时间间隔），因此怀疑自己是不是被墙了，但是vpn正常，像一个之后1-2k的txt文件需要很久才能读取到。

问：
1.这个ipfs上传文件是不是需要很久才能查看，如何查看上传进度。
2.下载下来的文件是一个无格式的文件，如何实现上传的文件格式即为下载的文件格式。

代码如下：

import React, {Component} from 'react';
import './App.css';

const ipfsAPI = require('ipfs-api');
const ipfs = ipfsAPI({host: 'localhost', port: '5001', protocol: 'http'});
// hash = 'QmdkpWSqP1eCMyY5epNLzqdp1M16nUYM2CkxwZPZy3vQHc';
// function Utf8ArrayToStr(array) {
//   var out,
//     i,
//     len,
//     c;
//   var char2,
//     char3;

//   out = "";
//   len = array.length;
//   i = 0;
//   while (i < len) {
//     c = array[i++];
//     switch (c >> 4) {
//       case 0:
//       case 1:
//       case 2:
//       case 3:
//       case 4:
//       case 5:
//       case 6:
//       case 7:
//         // 0xxxxxxx
//         out += String.fromCharCode(c);
//         break;
//       case 12:
//       case 13:
//         // 110x xxxx   10xx xxxx
//         char2 = array[i++];
//         out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
//         break;
//       case 14:
//         // 1110 xxxx  10xx xxxx  10xx xxxx
//         char2 = array[i++];
//         char3 = array[i++];
//         out += String.fromCharCode(((c & 0x0F) << 12) | ((char2 & 0x3F) << 6) | ((char3 & 0x3F) << 0));
//         break;
//       default:
//         break;
//     }
//   }

//   return out;
// }


class App extends Component {

  constructor(props) {
    super(props);
    this.state = {
      strHash: null,
      strContent: null,
      imgSrc: null
    }
  }

  saveTextBlobOnIpfs = (blob) => {
    return new Promise(function(resolve, reject) {
      const descBuffer = Buffer.from(blob, 'utf-8');
      ipfs.add(descBuffer).then((response) => {
        console.log(response)
        resolve(response[0].hash);
      }).catch((err) => {
        console.error(err)
        reject(err);
      })
    })
  }

  saveImageOnIpfs = (reader) => {
    return new Promise(function(resolve, reject) {
      const buffer = Buffer.from(reader.result);
      ipfs.add(buffer).then((response) => {
        console.log(response)
        resolve(response[0].hash);
      }).catch((err) => {
        console.error(err)
        reject(err);
      })
    })
  }


  render() {
    return (<div>
      <input type="file" ref="file" id="file" name="file" multiple="multiple"/>
      <br/>
      <input ref="ipfsContent"/>
      <button onClick={() => {
          var file = this.refs.file.files[0];
          var reader = new FileReader();
          // reader.readAsDataURL(file);
          reader.readAsArrayBuffer(file)
          reader.onloadend = (e) => {
            console.log(reader);
            // 上传数据到IPFS
            this.saveImageOnIpfs(reader).then((hash) => {
              console.log(hash);
              this.setState({
                imgSrc: hash,
                strHash: hash
              })
            });
          }

          // let ipfsContent = this.refs.ipfsContent.value;
          // console.log(ipfsContent);
          // this.saveTextBlobOnIpfs(ipfsContent).then((hash) => {
          //   console.log(hash);
          //   this.setState({strHash: hash});
          // });
        }}>提交到IPFS</button>
      <p>http://ipfs.io/ipfs/{this.state.strHash}</p>
      <button onClick={() => {
          console.log('从ipfs读取数据。')
          let hash = this.state.strHash;
          
          ipfs.cat(hash).then((stream) => {
            console.log(stream);
            let strContent = Utf8ArrayToStr(stream);
            console.log(strContent);
            this.setState({strContent: strContent});
          });
        }}>读取数据</button>
      <h1>{"https://ipfs.io/ipfs/" + this.state.imgSrc}</h1>
      <img alt="区块链部落"  src={"http://127.0.0.1:8080/ipfs/" + this.state.imgSrc}/>
      </div>);
  }
}

export default App;