大家好，很高兴又见面了，我是"高级前端进阶"，由我带着大家一起关注前端前沿、深入前端底层技术，大家一起进步，也欢迎大家关注、点赞、收藏、转发，您的支持是我不断创作的动力。
1.什么是 nsfwjsnsfwjs 是一个简单的 JavaScript 库，帮助用户快速识别不合时宜的图像。而且一切都在客户端的浏览器中完成。 NSFWJS 虽然并不完美，但它相当准确（小型模型约为 90%，中型模型约为 93%），并且也一直在变得越来越准确。
NSFW detection on the client-side via TensorFlow.js
nsfwjs 库将图像概率分为以下 5 类：
绘图 - 工作绘图安全，包括：动漫Hentai - 无尽和色情图画中性 - 工作安全中性图像色情 - 色情图片、性行为性感 - 露骨的色情图片，而不是色情内容
NSFWJS 将 TensorFlow.js 作为对等依赖项（peer dependency）提供支持。如果项目未安装 TFJS 则需要手动添加。
// peer dependencyyarn add @tensorflow/tfjs// install NSFWJSyarn add nsfwjs对于脚本标签，添加 <script type="text/javascript" src="https://unpkg.com/nsfwjs">。然后只需访问 nsfwjs 全局变量即可，当然前提是已经导入 TensorFlow.js。
目前 nsfwjs 在 Github 通过 MIT 协议开源，有超过 7.3k 的 star、1.9k 的项目依赖量，是一个值得关注的前端开源项目。
2.如何使用 nsfwjs2.1 基础用法nsfwjs 支持 async/await 语法，使用起来非常方便：
import * as nsfwjs from 'nsfwjs'const img = document.getElementById('img')// 从 S3 加载模型。// 请参阅在您的站点上托管模型文件的部分const model = await nsfwjs.load()// 图片分类const predictions = await model.classify(img)console.log('Predictions:', predictions)2.2 加载内容 loadnsfwjs 还支持丰富的 API，比如 load。在对任何图像进行分类之前，需要加载模型。可以使用可选的第一个参数并从网站加载模型。
const model = nsfwjs.load('/path/to/model/directory/')如果使用的模型需要尺寸不是 224x224 的图像，则可以在 options 参数中传递尺寸：
const model = nsfwjs.load('/path/to/different/model/', { size: 299})如果使用的是图模型，则无法使用 infer 方法，并且需要告诉模型加载正在选项中处理图模型：
const model = nsfwjs.load('/path/to/different/model/', { type: 'graph'})如果在浏览器中使用并且希望随后从索引数据库或本地存储加载，可以使用适当的方案保存底层模型并从那里加载。
const initialLoad = await nsfwjs.load('/path/to/different/model')await initialLoad.model.save('indexeddb://model')const model = await nsfwjs.load('indexeddb://model')2.3ify 分类classify 函数可以采用任何基于浏览器的图像元素，例如：<img>、<video>、<canvas > 并返回最可能的预测及其置信度的数组。
// Return top 3 guesses (instead of all 5)const predictions = await model.classify(img, 3)2.4 生产环境部署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}`)3.在 Node.js 中使用 nsfwjs借助于 NPM，开发者还可以在服务器端使用该模型：
$ npm install nsfwjs$ npm install @tensorflow/tfjs-nodeconst 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() // 加载本地模型 const image = await tf.node.decodeImage(pic.data,3) const predictions = await model.classify(image) image.dispose() // Tensor 内存必须显式管理（让 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 _modelconst 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('Missing image 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 进行预处理任务和更多文件格式。
lovell/sharp 高速 Node-API 模块的典型用例是将常见格式的大图像转换为较小的、网络友好的不同尺寸的 JPEG、PNG、WebP、GIF 和 AVIF 图像。可与所有支持 Node-API v9 的 JavaScript 运行时一起使用，包括 Node.js（^18.17.0 或 >= 20.3.0）、Deno 和 Bun。
由于使用了 libvips，调整图像大小通常比使用最快的 ImageMagick 和 GraphicsMagick 设置快 4 倍到 5 倍。色彩空间、嵌入式 ICC 配置文件和 Alpha 透明度通道均已正确处理。 Lanczos 重采样确保不会为了速度而牺牲质量。除了图像大小调整之外，还可以进行旋转、提取、合成和伽玛校正等操作。大多数现代 macOS、Windows 和 Linux 系统不需要任何额外的安装或运行时依赖项。4.本文总结本文主要和大家介绍 nsfwjs ，其是一个简单的 JavaScript 库，帮助用户快速识别不合时宜的图像，而且一切都在客户端的浏览器中完成。因为篇幅问题，关于 nsfwjs 只是做了一个简短的介绍，但是文末的参考资料提供了大量优秀文档以供学习，如果有兴趣可以自行阅读。如果大家有什么疑问欢迎在评论区留言。
参考资料https://github.com/infinitered/nsfwjs
https://www.edenai.co/post/how-to-use-explicit-content-detection-api-with-javascript-in-5-minutes
https://github.com/lovell/sharp
https://nsfwjs.com/
