【vue项目】读取本地文件

前端无法像原生APP一样直接操作本地文件，否则的话打开个网页就能把用户电脑上的文件偷光了，所以需要通过用户触发，用户可通过以下三种方式操作触发：
1、通过input type=”file” 选择本地文件
2、通过拖拽的方式把文件拖过来
3、在编辑框里面复制粘贴

如果是非要不经过用户通过js读取，建议将文件放在项目static目录下，然后通过ajax请求

vue引用static下资源时，必须使用绝对路径/static/[name]
因为static目录下的文件并不会被webpack处理，它们会直接复制到最终目录（dist/static）下，一般放类库文件

1. 将本地文件放在static下
2. 通过get请求
   因为请求的是本项目static目录下的资源，所以请求的url不需要加域名和端口（如"http:localhost:8081"），不然部署到服务器容易请求不到数据

this.$axios
        .get("/static/data/zt_bj_5g_location3.csv")
        .then(res => {
    
    
          let csv= res.data;
          console.log(csv);
        });

如果是部署到tomcat服务器，最好区分一下开发环境还是生产环境

const baseUrl = process.env.NODE_ENV == "development"?'':'/myprojectname';
module.exports={
    
    
  baseUrl:baseUrl
}

let url=baseUrl+"/static/data/zt_bj_5g_location3.csv"
this.$axios
        .get(url)
        .then(res => {
    
    
          let csv= res.data;
          console.log(csv);
        });