node.js - Comment utiliser le module fs de Node dans un environnement de navigateur?

Question

J'ai une exigence. Je dois utiliser du js pur pour lire les images. Le seul paramètre est le chemin de l'image. Voici le code dans l'environnement du nœud

.

var fs = require("fs");
var imageFile = fs.readFileSync('test.png', 'base64');
console.log(imageFile);

Utilisez Browserify pour convertir en

(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]);

Lors de l'exécution dans l'environnement du navigateur, l'erreur suivante apparaît. Il semble que browserify ne puisse pas convertir le module fs pour s'exécuter dans le navigateur. La lecture des fichiers dans le navigateur est à l'origine un problème (si vous n'utilisez aucun formulaire HTML)
bundle. js:5 Uncaught TypeError : fs.readFileSync n'est pas une fonction

Answer 1

fileReader？

Answer 2

Tout d'abord, soyons clairs, des outils comme browserify ne peuvent convertir le code JavaScript qu'à l'aide du mécanisme de chargement du module commonjs dans une forme que le navigateur peut comprendre. Cela ne signifie pas que n’importe quel code Node.js peut être utilisé côté navigateur. browserify 这样的工具仅仅能将使用 commonjs 模块加载机制的 JavaScript 代码转换成为浏览器可以理解的形式。这并不代表着任意 Node.js 代码都可以在浏览器端使用。

最典型的例子就是 fs 模块，它是完全不可能被浏览器端调用的。对本地文件的读写能力完全违反了浏览器本身的安全机制，试想你打开一个网页，然后这个网页竟然就可以读写你本地硬盘上的文件，这该是多么可怕的一件事情！

因此，你的思路本身或许需要重新整理一下，什么样的功能需求促使你要在网页端读写文件呢？如果仅仅是在客户端对用户在 file uploader 中上传的文件预处理，那么你该使用浏览器端原生的 FileReader

L'exemple le plus typique est le module fs, qu'il est totalement impossible d'appeler par le navigateur. La possibilité de lire et d'écrire des fichiers locaux viole complètement le mécanisme de sécurité du navigateur lui-même. Imaginez simplement que vous ouvrez une page Web, et que cette page Web peut réellement lire et écrire des fichiers sur votre disque dur local. 🎜 🎜Par conséquent, votre réflexion elle-même devra peut-être être réorganisée. Quelles exigences fonctionnelles vous motivent à lire et à écrire des fichiers sur la page Web ? Si vous prétraitez uniquement les fichiers téléchargés par les utilisateurs dans file uploader côté client, vous devez alors utiliser l'API FileReader native du navigateur🎜