JavaScript前端代码中使用node的module.exports/require()方法。

Question

我一直在研究使用类似SVGO这样的库来清理前端用户提交的SVG代码。SVGO是基于node.js的库，通常在后端使用，因此我一直在努力理解如何将SVG代码从前端发送到后端，然后再将清理后的代码呈现在前端。

正是当我尝试弄清楚这一点时，我查看了他们的Web应用程序示例，检查了在其中运行的代码，该代码位于链接脚本内，我通常会在后端上看到这些脚本。特别地，许多函数的签名为(完整脚本):

1: [function(require, module, exports) {
    "use strict";
    var loadScripts = require("./load-scripts"),
    ...
module.exports = exportedFunction;
}]

相当混乱，因为我通常将其与后端相关的JS联系在一起，特别是require、module.exports等语法。

问题：

1. 这只是他们整个库SVGO在前端上运行吗？他们是否手动重写了它以使其与前端兼容？还是像browserfy这样的工具可以做到这一点？

2. 如果是这样，前端和后端运行它的好处是什么？哪种方式更容易/是否有一些常见的指南告诉我们应该在哪里使用哪个？

3. 初步看来，直接在浏览器中运行SVGO库并在那里进行转换似乎更容易（因为我不必调用后端）。那么一般的惯例是什么呢？

感谢任何见解。我试图确保按照最合理的方式构建我的项目/符合Web标准。

- nikk wong

---

请查看browserify或requirejs。它们都是前端模块加载器。 - n00dl3

@dandavis，然而，就问题提出的方式而言，并不意味着他知道这个库，而是“我该如何将我的后端代码browserify化？” - n00dl3

1. Browserify可以将Node.js包转换为可在浏览器中运行的代码，即使输出结果不太美观。
2. 客户端是免费且安全的，而Node.js可能会很昂贵且存在风险。
3. 前期进行的清理工作越多，后端就有更多时间和内存来处理其他事情。

- dandavis

@JuniusRendel：touchè - dandavis

Answer 1

答案：

1. 他们使用像browserify或requirejs等模块加载器，允许在浏览器中使用commonjs模块。这并不意味着所有库都可以在客户端工作，例如在浏览器上使用node io模块是行不通的。

2. 在发送之前进行一些浏览器端的清理工作可能会很有用（可以节省几KB）。浏览器的优点是免费的，你不需要为在客户端上运行的代码支付托管费用，可以在浏览器上运行一些可选的清理工作。但请注意：参见第3条。

3. 即使在客户端容易进行清理工作，你仍应该始终检查和清理后端用户输入的内容，特别是.svg文件，因为它们可能包含可以允许XSS攻击的

- n00dl3

---

太棒了！感谢您的帮助。那么，在什么情况下，将SVGO放在后端更可取呢？如果将其作为前端模块运行如此有益，为什么要将其编写为后端（除了那些只打算在本地使用它的人）？ - nikk wong

将其运行在前端并不是“非常有益的”，它只是可以在前端运行，并且可能是有益的。并非所有的托管提供商都提供Nodejs托管，如果您的系统管理员不熟悉这项技术，他可能不会对托管公开的nodejs服务器感到热情等等...如果您正在上传SVG并且希望确保您的SVG已经优化（例如，如果用户禁用了js，则在前端上不会进行优化）。然而，我不知道这个库，所以无法告诉您更多信息... - n00dl3

非常好的回答。谢谢！ - nikk wong

我认为你不应该在前端进行消毒，但是你可以进行清理，例如裁剪/调整图像、格式化电话号码和其他不试图减少风险的美容程序。 - dandavis