这个视频来说一下js的文件读取。刚好有同学问到,首先要说一点,对文件进行读写、增删、改查一系列的操作是涉及到用户隐私安全的。用前端语言,比方JS是不可能完全做到的。要不然写一个网页,访问了就可以在本地电脑上面随便新增文件,或者把电脑里面的东西全部给干了或者改了,都是一件很恐怖的事情。
可以实现文件操作的语言,比方nodejs,一些后端语言,PHP、JAVA这些。这个时候要分清楚是操作哪里的文件,是客户端还是服务器端。如果要操作客户端的,都要获取相应的权限。比方手机端的应用都会向我们拿权限。很多时候不给文件访问的权限,比方图库,连相册访问都访问不了,不用增删、改查了,这些先不管它了。
JS的文件读取,简单的文件读取还是可以实现的。但是同样,这里要读取的是本地的文件,其实也需要用户给予权限。这里要怎么做?就需要配合一个input的控件,让用户自己来操作。这里提供了一个按钮,只有用户主动去选择了,这个行为是用户触发的。换言之就是得到了用户的允许才会对文件进行读取,不会JS自动触发、自动读取,那就不安全了。
来看一下具体怎么操作。要对input添加一个onchange事件,然后执行一个函数a1s,把事件对象传进去,然后来写这个函数。这里需要用到一个fileReader类,先把对象实例化出来。可以先把事件对象打印出来看一下。先把控制台打开,然后来选择文件。这里选择a.txt文件,事件对象打印出来了,展开来看一下。
里面有个target,target下面还有一个叫files,这一个下标为0的,files里面下标为0的,放的就是刚才选择的文件a.txt,所以就要读取用户选择的文件。这里是可以读取成好几种格式的,就把它读成文本。