vue 读取 本地 文件 nginx 代理

nginx.conf 文件中修改

 

    server {
        listen       80;
        server_name  127.0.0.1;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

       # location / {
        #    root   D:\webProjects\sl-zjhse-web\dist;
          #  index  index.html index.htm;
      #  }
         location /Desktop {

# 解决本地跨域301错误，添加请求头
         add_header 'Access-Control-Allow-Origin' '*' always;
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, PATCH, DELETE, PUT, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type, X-Custom-Header, Access-Control-Expose-Headers, Token, Authorization';
            add_header 'Access-Control-Allow-Headers'  '*';
            add_header 'Access-Control-Max-Age' 1728000;
            root   C:\Users\HP;
            index demo.xlsx;
           
        }

}

前端代码：

this.readExcelFile('http://127.0.0.1:80/Desktop/')

readExcelFile(url) {

  Axios.get(url,{responseType:'arraybuffer'})

      .then((res)=>{

        let data = new Uint8Array(res.data)

        let wb = XLSX.read(data, {type:"array"})

        let sheets = wb.Sheets // 获取文档数据

          this.transformSheets(sheets)

      }).catch( err =>{

        this.err = err

      })

    },

transformSheets(sheets){

      let content1 = []

      let tmplist = []

      for (let key in sheets){

        //读出来的workbook数据很难读,转换为json格式,参考https://github.com/SheetJS/js-xlsx#utility-functions

        tmplist.push(XLSX.utils.sheet_to_json(sheets[key]).length)

        content1.push(XLSX.utils.sheet_to_json(sheets[key]))

      }

      console.log(tmplist)

      console.log(content1,'121212')

    },

读取的是"C:\Users\HP\Desktop\demo.xlsx"

需要前端引入插件 XLSX

1. npm install xlsx

2. 、在main.js中引入XLSX

3. import XLSX from 'xlsx'

4. Vue.use(XLSX)

读取public 下的文件只要把url 改为 文件名即可