问题描述
我有一个需求，需要使用纯js读取图片，参数只有图片路径，下面是node环境中的代码
var fs = require('fs');var imageFile = fs.readFileSync(’test.png’, ’base64’);console.log(imageFile);
使用browserify转换成
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=='function'&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error('Cannot find module ’'+o+'’');throw f.code='MODULE_NOT_FOUND',f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=='function'&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){},{}],2:[function(require,module,exports){var fs = require('fs');var imageFile = fs.readFileSync(’test.png’, ’base64’);console.log(imageFile);},{'fs':1}]},{},[2]);
在浏览器环境中运行提示，如下错误，貌似browserify并不能将fs模块转成能在浏览器中运行，本来在浏览器中读取文件就是一项难题（如果不借助任何html表单的话）bundle.js:5 Uncaught TypeError: fs.readFileSync is not a function
问题解答
回答1：fileReader？
回答2：首先明确一点，类似 browserify 这样的工具仅仅能将使用 commonjs 模块加载机制的 JavaScript 代码转换成为浏览器可以理解的形式。这并不代表着任意 Node.js 代码都可以在浏览器端使用。
最典型的例子就是 fs 模块，它是完全不可能被浏览器端调用的。对本地文件的读写能力完全违反了浏览器本身的安全机制，试想你打开一个网页，然后这个网页竟然就可以读写你本地硬盘上的文件，这该是多么可怕的一件事情！
因此，你的思路本身或许需要重新整理一下，什么样的功能需求促使你要在网页端读写文件呢？如果仅仅是在客户端对用户在 file uploader 中上传的文件预处理，那么你该使用浏览器端原生的 FileReader API
