客户端不雅内容检测

一个简单的 JavaScript 库，帮助你在客户端浏览器中快速识别不雅图像。NSFWJS 并不完美，但它的准确率相当高（小型模型约为 90%，中型模型约为 93%）……而且它还在不断改进。

这有什么用呢？请查看我们的公告博客文章。

注意

如果您尝试访问 CloudFront 托管的模型时遇到错误，很可能是由于该模型已被移至新位置。请参阅我们的自托管模型部分。在处理完一些盗链行为后，我们会将模型恢复到原位置。

目录

• 快速：如何使用该模块
  • 选择性模型包（Tree Shaking）
• 库 API
  • load 加载模型
  • 缓存
  • classify 分类图像
  • dispose 释放已加载的模型
• 生产环境
• 后端选择
  • WASM 后端（可选）
  • WebGPU 后端（可选）
  • Node.js 后端
• 安装
  • 自托管模型
• 运行示例
  • TensorFlow.js 在浏览器中
  • Browserify
  • React Native
  • Node.js 应用程序
  • NSFW 过滤器
• 学习 TensorFlow.js
• 更多！
  • 开源项目
  • 需要专家？为您的下一个项目聘请 Infinite Red
• 贡献者

该库将图像概率分为以下 5 类：

• Drawing - 适合工作场所的插画（包括动漫）
• Hentai - 色情和成人向插画
• Neutral - 适合工作场所的中性图像
• Porn - 色情图片、性行为
• Sexy - 性暗示图像，但不属于色情内容

该演示是一个持续部署的源代码——快来试试吧：http://nsfwjs.com

快速：如何使用该模块

import * as nsfwjs from "nsfwjs";

const img = document.getElementById("img");

// 如果您想自行托管模型或使用其他可用模型，请参阅“自托管模型”部分。
const model = await nsfwjs.load();

// 对图像进行分类
const predictions = await model.classify(img);
console.log("预测结果：", predictions);

选择性模型包（Tree Shaking）

nsfwjs 保持默认行为，并包含内置的模型定义。若需选择性打包，请从 nsfwjs/core 导入，并仅传递您所需的模型到 modelDefinitions 中。

import { load } from "nsfwjs/core";
import { MobileNetV2Model } from "nsfwjs/models/mobilenet_v2";
import { MobileNetV2MidModel } from "nsfwjs/models/mobilenet_v2_mid";

const model = await load("MobileNetV2", {
  modelDefinitions: [MobileNetV2Model, MobileNetV2MidModel],
});

如果传递空的模型注册表，命名的捆绑模型加载将会失败：

await load("MobileNetV2", { modelDefinitions: [] }); // 抛出异常

库 API

load 加载模型

在对任何图像进行分类之前，您需要先加载模型。

const model = nsfwjs.load(); // 默认： "MobileNetV2"

您可以使用可选的第一个参数来指定要使用的内置模型（共有三种）。默认值为：“MobileNetV2”。

对于 Tree Shaking 的选择性模型打包，请使用 nsfwjs/core，并按上述方式传递 modelDefinitions。

const model = nsfwjs.load("MobileNetV2Mid"); // "MobileNetV2" | "MobileNetV2Mid" | "InceptionV3"

您还可以使用相同的参数，从自己的网站或服务器加载模型，具体说明请参阅自托管模型部分。这样做可以将模型加载的包体积减少约 1.33 倍（33%），因为您可以直接使用二进制文件，而不是随软件包一起打包的 Base64 编码数据。例如，“MobileNetV2”模型在软件包中为 3.5MB，而托管的二进制文件仅为 2.6MB。不过，这种优化只有在客户端浏览器每次加载模型（未使用缓存）时才会体现出来；而在服务器端，您只需在服务器启动时加载一次即可。

如果您通过 URL 自行托管模型，并希望获得最小的应用程序包体积，应从 nsfwjs/core 而不是 nsfwjs 中导入 load。核心入口点默认不包含内置模型定义，因此打包工具不会将这些模型资源引入您的应用程序包中。

import { load } from "nsfwjs/core";

const model = await load("/path/to/mobilenet_v2/model.json");

MobileNetV2 模型 - 224x224

const model = nsfwjs.load("/path/to/mobilenet_v2/");

如果您使用的模型需要不同于 224x224 的图像尺寸，可以在选项参数中指定尺寸。

MobileNetV2Mid 模型 - 图模型

/* 您可能需要以图模型格式加载此模型 */
const model = nsfwjs.load("/path/to/mobilenet_v2_mid/", { type: 'graph' });

如果使用图模型，则无法使用推理方法，您需要在选项中告知模型加载程序您正在处理的是图模型。

InceptionV3 模型 - 299x299

const model = nsfwjs.load("/path/to/inception_v3/", { size: 299 });

缓存

如果你在浏览器中使用，并希望后续从 IndexedDB 或本地存储加载（注意：模型大小可能超出本地存储的限制！），你可以使用相应的方案保存底层模型，然后从中加载。

const initialLoad = await nsfwjs.load(
  "/path/to/different/model/" /*, { ...options }*/
);
await initialLoad.model.save("indexeddb://exampleModel");
const model = await nsfwjs.load("indexeddb://exampleModel" /*, { ...options }*/);

参数

首次加载：

1. 包含 model.json 文件的文件夹的 URL 或路径。
2. 可选对象，包含你的模型期望的尺寸或类型属性。

后续加载：

1. IndexedDB 路径。
2. 可选对象，包含你的模型期望的尺寸或类型属性。

返回值

• 即可使用的 NSFWJS 模型对象

故障排除

• 在加载模型的标签页中，打开开发者工具并切换到“Application”选项卡。在左侧“Storage”部分下，有一个名为 “IndexedDB”的子部分。在这里你可以查看模型是否已成功保存。

有关完整的浏览器 Worker 实现（包括后端初始化、优先从 IndexedDB 加载以及未命中时的缓存保存），请参阅 examples/nsfw_demo/src/nsfwjs.worker.ts。

对图像进行 classify

此函数可以接受任何基于浏览器的图像元素（<img>、<video>、<canvas>），并返回最可能的预测结果及其置信度。

// 返回前 3 名猜测（而不是全部 5 名）
const predictions = await model.classify(img, 3);

参数

• 要检查的张量、图像数据、图像元素、视频元素或画布元素。
• 要返回的结果数量（默认为全部 5 个）。

返回值

• 包含 className 和 probability 的对象数组。数组的大小由 classify 函数中的第二个参数决定。

释放已加载的模型

如果你不再需要某个模型实例，可以调用 dispose() 来释放持有的张量和模型资源。

const model = await nsfwjs.load();
// ... 分类/推理
model.dispose();

生产环境

TensorFlow.js 提供了两个标志：enableProdMode 和 enableDebugMode。如果你要在生产环境中使用 NSFWJS，请务必在加载 NSFWJS 模型之前启用生产模式。

import * as tf from "@tensorflow/tfjs";
import * as nsfwjs from "nsfwjs";
tf.enableProdMode();
//...
let model = await nsfwjs.load(`${urlToNSFWJSModel}`);

注意：建议在进入生产环境之前，按照“托管你自己的模型”一节所述，自行下载并托管模型。这可能会改善模型的初始加载时间。此外，如果在浏览器中使用该模型，还可以考虑对其进行 缓存。

后端选择

NSFWJS 使用当前激活的 TensorFlow.js 后端。

显式设置后端是可选的。如果你导入了一个或多个后端并调用 await tf.ready()，TensorFlow.js 会自动选择最佳可用后端。

仅当你希望在不同设备上获得确定性行为时，才应使用 tf.setBackend(...)。

自动后端选择：

import * as tf from "@tensorflow/tfjs";
import "@tensorflow/tfjs-backend-webgpu";
import "@tensorflow/tfjs-backend-wasm";
import * as nsfwjs from "nsfwjs";

await tf.ready();

const model = await nsfwjs.load();

固定后端选择：

import * as tf from "@tensorflow/tfjs";
import "@tensorflow/tfjs-backend-webgpu";

await tf.setBackend("webgpu");
await tf.ready();

WASM 后端（可选）

yarn add @tensorflow/tfjs-backend-wasm

import * as tf from "@tensorflow/tfjs";
import {
  setWasmPaths,
} from "@tensorflow/tfjs-backend-wasm";
import "@tensorflow/tfjs-backend-wasm";

// 如果你没有使用标准打包工具，需设置 .wasm 二进制文件的路径。
setWasmPaths("https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-wasm/dist/");

await tf.setBackend("wasm");
await tf.ready();

WebGPU 后端（可选）

yarn add @tensorflow/tfjs-backend-webgpu

import * as tf from "@tensorflow/tfjs";
import "@tensorflow/tfjs-backend-webgpu";

await tf.setBackend("webgpu");
await tf.ready();

后端建议：

• webgpu：在支持的浏览器和硬件上通常速度最快。
• webgl：现代桌面和移动浏览器中的强大默认选项。
• wasm：适用于 WebGL 不可用或受限的环境的有用备选方案。
• cpu：兼容性广，但通常速度较慢。

Node.js 后端

对于 Node.js 工作负载，建议使用 @tensorflow/tfjs-node（或在适用时使用 @tensorflow/tfjs-node-gpu）以获得更好的性能。示例请参见“Node.js 应用”一节。

务必在目标浏览器/设备组合上进行基准测试。

安装

NSFWJS 依赖于 TensorFlow.js 作为其对等依赖项。如果你的项目尚未包含 TensorFlow.js，你可能需要将其添加进来。

# 对等依赖
$ yarn add @tensorflow/tfjs
# 安装 NSFWJS
$ yarn add nsfwjs

对于 script 标签，需包含所有捆绑包，如 这里 所示。然后可以直接访问 nsfwjs 全局变量。这要求你已经同时引入了 TensorFlow.js。

托管你自己的模型

NSFWJS 的核心是 NSFW 检测模型。默认情况下，这些模型被打包在这个软件包中。但你可能希望将模型托管在自己的服务器上，以便通过加载原始二进制文件来减小捆绑包大小，或者托管自定义模型。如果你想托管 模型文件 的自定义版本，可以按照以下步骤操作。然后可以在 load 函数中传递你托管文件的相对 URL，并在必要时提供 options。

如果加载的是托管模型 URL，建议使用 nsfwjs/core，这样你的应用就不会打包内置的模型定义。请参阅“选择性模型捆绑包（Tree Shaking）”一节。

以下是将默认模型安装到网站上的方法：

1. 下载该项目，可以选择下载 ZIP 文件或使用 git clone https://github.com/infinitered/nsfwjs.git 进行克隆。
2. 从项目根目录中提取 models 文件夹，并将其放入你的 Web 应用程序的 public 目录中，以便与你的网站一起作为静态文件提供。（你也可以将其托管在任何地方，例如 S3 存储桶中，只要可以通过 URL 访问即可）。
3. 获取 URL 并将其放入 nsfwjs.load() 中。例如：nsfwjs.load(https://yourwebsite.com/models/mobilenet_v2/model.json)。

运行示例

浏览器中的 TensorFlow.js

驱动 https://nsfwjs.com/ 的演示位于 examples/nsfw_demo 文件夹中。

要运行该演示，执行 yarn demo，它会将最新代码复制到演示中并启动开发服务器。

Browserify

仅使用 Promise 和 <script> 标签的浏览器化版本，可在 minimal_demo 文件夹中找到。

<script src="/path/to/model/directory/model.min.js"></script>
<script src="/path/to/model/directory/group1-shard1of2.min.js"></script>
<script src="/path/to/model/directory/group1-shard2of2.min.js"></script>
<script src="/path/to/bundle/nsfwjs.min.js"></script>

您应该将 nsfwjs.min.js 文件以及所有要使用的模型包托管在您的项目目录下，并通过 <script> 标签中的 src 属性引用它们。

React Native

NSFWJS React Native 应用

加载本地模型以减少网络负载，并利用 TFJS-React-Native。博客文章

Node JS 应用程序

通过 NPM，您也可以在服务器端使用该模型。

$ npm install nsfwjs
$ npm install @tensorflow/tfjs-node

const axios = require("axios"); //您可以使用任何 HTTP 客户端
const tf = require("@tensorflow/tfjs-node");
const nsfw = require("nsfwjs");
async function fn() {
  const pic = await axios.get(`link-to-picture`, {
    responseType: "arraybuffer",
  });
  const model = await nsfw.load(); // 要加载本地模型，可以使用 nsfw.load('file://./path/to/model/')
  // 图像必须是 tf.tensor3d 格式
  // 您可以通过 tf.node.decodeImage(Uint8Array,channels) 将图像转换为 tf.tensor3d
  const image = await tf.node.decodeImage(pic.data, 3);
  const predictions = await model.classify(image);
  image.dispose(); // 必须显式管理张量内存（仅仅让 tf.Tensor 超出作用域并不能释放其内存）。
  console.log(predictions);
}
fn();

以下是另一个使用 Express 的 multipart/form-data POST 示例，假设您使用的是 JPG 格式。

const express = require("express");
const multer = require("multer");
const jpeg = require("jpeg-js");

const tf = require("@tensorflow/tfjs-node");
const nsfw = require("nsfwjs");

const app = express();
const upload = multer();

let _model;

const convert = async (img) => {
  // 解码后的图像以 UInt8 字节数组形式存储
  const image = await jpeg.decode(img, { useTArray: true });

  const numChannels = 3;
  const numPixels = image.width * image.height;
  const values = new Int32Array(numPixels * numChannels);

  for (let i = 0; i < numPixels; i++)
    for (let c = 0; c < numChannels; ++c)
      values[i * numChannels + c] = image.data[i * 4 + c];

  return tf.tensor3d(values, [image.height, image.width, numChannels], "int32");
};

app.post("/nsfw", upload.single("image"), async (req, res) => {
  if (!req.file) res.status(400).send("缺少 multipart/form-data 图像");
  else {
    const image = await convert(req.file.buffer);
    const predictions = await _model.classify(image);
    image.dispose();
    res.json(predictions);
  }
});

const load_model = async () => {
  _model = await nsfw.load();
};

// 将模型保留在内存中，确保只加载一次
load_model().then(() => app.listen(8080));

// curl --request POST localhost:8080/nsfw --header 'Content-Type: multipart/form-data' --data-binary 'image=@/full/path/to/picture.jpg'

您还可以使用 lovell/sharp 进行预处理任务和更多文件格式的支持。

NSFW 过滤器

NSFW Filter 是一个开源的 Google Chrome 浏览器扩展，它使用 NSFWJS 来过滤掉不适宜的内容图片。

请在此处查看该项目：GitHub。

学习 TensorFlow.js

学习如何编写像 NSFWJS 这样的库，请参阅我的 O'Reilly 出版社书籍《Learning TensorFlow.js》，可在 O'Reilly 和 亚马逊 上购买。

更多！

现已提供常见问题解答页面：FAQ。

有关 NSFWJS 和 TensorFlow.js 的更多信息 - https://youtu.be/uzQwmZwy3yw

该模型是在 Keras 中经过数天训练的，使用了超过 60GB 的数据。请务必查看由 Alexander Kim 提供的数据训练而成的模型代码：nsfw_model 和他的 nsfw_data_scraper。

开源

作为开源项目，NSFWJS 可免费使用，并且永远保持免费：heart:。它采用 MIT 许可证，我们将始终竭诚帮助并快速回复各类问题。如果您想与我们取得联系，请加入我们的 社区 Slack。

需要专家？为您的下一个项目聘请 Infinite Red

如果您的项目需要 React Native 方面的专家，Infinite Red 随时为您提供帮助！我们经验丰富的软件工程师团队曾与微软、Zoom 和 Mercari 等公司合作，成功完成了许多复杂项目。

无论是完整项目的开发，还是对团队进行 React Native 培训，我们都能够帮助您解决公司最棘手的工程挑战——同时为您带来愉快的合作体验。 准备好了解我们如何携手合作了吗？发送邮件给我们

贡献者

感谢以下各位贡献者（表情符号说明见 allcontributors.org）：

Gant Laborde 💬 📝 💻 💡 🤔 🚇 👀 ⚠️	Jamon Holmgren 📖 🤔 💻 🖋	Mazen Chami 📖 💻 👀 ⚠️	Jeff Studenski 🎨	Frank von Hoven III 📖 🤔	Sandesh Soni 💻	Sean Nam 📖
Gilbert Emerson 💻	Oleksandr Kozlov 🚇 ⚠️ 💻	Morgan 💻 🤔	Michel Hua 💻 📖	Kevin VanGelder 💻 📖	Jesse Nicholson 🔣 🤔	camhart 📖
Cameron Burkholder 🎨	qwertyforce 📖	Yegor <3💻 ⚠️	Navendu Pottekkat📖	Vladislav💻 📖	Nacht💻	kateinkim💻 📖
jan📖	Rohan Mukherjee💬 🚇 🚧 💻	Hasitha Wickramasinghe💻 📖 💡 🤔 🚇 ⚠️

This project follows the all-contributors specification. Contributions of any kind welcome!

nsfwjs 快速上手指南

nsfwjs 是一个运行在客户端（浏览器或 Node.js）的 JavaScript 库，用于快速识别图像中是否包含不适宜内容（NSFW）。它基于 TensorFlow.js，无需后端服务器即可在本地完成分类。

环境准备

• 系统要求：支持现代浏览器（Chrome, Firefox, Safari, Edge）或 Node.js 环境。
• 前置依赖：
  • 项目需安装 @tensorflow/tfjs 作为对等依赖（Peer Dependency）。
  • 若需更佳性能，可选装特定后端（如 @tensorflow/tfjs-backend-wasm 或 @tensorflow/tfjs-backend-webgpu）。

安装步骤

使用 npm 或 yarn 安装核心库及 TensorFlow.js：

# 安装对等依赖 TensorFlow.js
yarn add @tensorflow/tfjs
# 或
npm install @tensorflow/tfjs

# 安装 nsfwjs
yarn add nsfwjs
# 或
npm install nsfwjs

提示：国内开发者若遇到下载缓慢，可配置淘宝镜像源： yarn config set registry https://registry.npmmirror.com

基本使用

以下是在浏览器环境中最简单的使用示例。

1. 导入与加载模型

首先导入库并加载默认模型（MobileNetV2）。

import * as nsfwjs from "nsfwjs";

// 获取图片元素
const img = document.getElementById("img");

// 加载模型 (默认从 CDN 加载，生产环境建议托管自己的模型)
const model = await nsfwjs.load();

2. 分类图像

调用 classify 方法对图像进行分析，返回预测结果数组。

// 对图像进行分类，返回概率最高的前 3 个结果
const predictions = await model.classify(img, 3);

console.log("Predictions: ", predictions);

3. 结果解读

返回的数组包含 className（类别）和 probability（置信度）。支持的类别如下：

• Drawing: 安全的工作绘图（包括动漫）。
• Hentai: 色情绘图。
• Neutral: 安全的普通图像。
• Porn: 色情图像、性行为。
• Sexy: 性暗示图像，非直接色情。

4. 释放资源（可选）

当不再需要模型实例时，调用 dispose() 释放内存。

model.dispose();

---

生产环境建议： 默认情况下模型从远程 CDN 加载。为了稳定性和加载速度，建议将模型文件托管到自己的服务器，并使用 nsfwjs.load("/path/to/your/model/") 进行加载。