【node】图片验证码(svg-captcha)

fruge365

发布于 2025-12-15 10:27:52

1940

新建 temp文件夹

生成package.json文件

使用vscode打开temp文件夹，并在终端输入命令npm init -y 并回车生成package.json文件

安装依赖

npm i svg-captcha -S

新建index.js文件

复制下面代码

// 引入svg-captcha
const svgCaptcha = require("svg-captcha");

// 生成验证码
const captcha = svgCaptcha.create({
  size: 3, // 字符数
  ignoreChars: "zxcvbnmasdfghjklqwertyuiop", // 过滤字符
  noise: 3, // 干扰线条数
  color: true,
  background: "#fff", // 背景颜色
});

// captcha 是个对象，text是验证码文字，data是验证码
console.log(captcha);

终端输入命令node index.js运行这个时候验证码还只能打印出来，看不到

创建http服务

完整代码

// 引入svg-captcha
const svgCaptcha = require("svg-captcha");
const http = require("http");

const server = http.createServer((req, res) => {
  // req 是请求  res是响应
  const captcha = svgCaptcha.create({
    size: 3, // 字符数
    ignoreChars: "zxcvbnmasdfghjklqwertyuiop", // 过滤字符
    noise: 3, // 干扰线条数
    color: true,
    background: "#fff", // 背景颜色
  });

  // 需要加请求头否则不能显示，请求头可以设置为两种，第二种后端常用
    res.setHeader("content-type", "text/html;charset=utf-8;");
//   res.setHeader("content-type", "image/svg+xml;");
  res.end(captcha.data);
});

// 设置一个没有使用的端口号，如果报错尝试换个端口号
server.listen(3003, () => {
  console.log("启动成功，http://localhost:3003");
});

终端输入命令node index.js运行浏览器访问查看效果