Vue客户端项目调用Node.js dns模块获取域名NS记录报错求助

核心问题分析 #

• Node.js的node:dns是服务端专属内置模块，浏览器环境（Vue客户端项目的运行环境）不支持该API，所以执行npm install --save node:dns无效——这个模块是Node.js内置的，不需要额外安装，但浏览器根本无法调用它。
• 你的代码还存在导入与调用函数名不匹配的低级错误：定义的函数是getNs，但导入的是getIp，调用的也是getIp，这会导致函数未定义的错误。

解决方案 #

方案一：搭建后端接口中转（推荐，可控性强） #

由于浏览器不能直接调用Node.js的DNS模块，需要搭建一个简单的Node.js后端接口，由后端执行DNS查询，再将结果返回给前端。

1. 编写后端接口（基于Express）

创建server.js文件：

const express = require('express');
const dns = require('node:dns');
const dnsPromises = dns.promises;
const cors = require('cors'); // 解决跨域问题
const app = express();

app.use(cors());
app.use(express.json());

// NS查询接口
app.post('/api/get-dns-ns', async (req, res) => {
  const { domain } = req.body;
  if (!domain) {
    return res.status(400).json({ success: false, error: '域名不能为空' });
  }

  try {
    const options = {
      family: 6,
      hints: dns.ADDRCONFIG | dns.V4MAPPED,
      all: true
    };
    const nsRecords = await dnsPromises.resolveNs(domain, options);
    res.json({ success: true, data: nsRecords });
  } catch (err) {
    res.json({ success: false, error: err.message || 'DNS查询失败' });
  }
});

// 启动服务
const PORT = 3001;
app.listen(PORT, () => {
  console.log(`后端服务运行在 http://localhost:${PORT}`);
});

安装依赖并启动服务：

npm install express cors
node server.js

2. 前端Vue组件修改调用逻辑

修正导入错误，改用axios请求后端接口：

<template>
  <div>
    <input v-model="domain" placeholder="输入域名">
    <button @click="goToSecondStep">查询NS记录</button>
  </div>
</template>

<script>
import axios from 'axios'; // 安装依赖：npm install axios

export default {
  data() {
    return {
      domain: ''
    };
  },
  methods: {
    async goToSecondStep() {
      if (!this.domain.trim()) return;
      try {
        const response = await axios.post('http://localhost:3001/api/get-dns-ns', {
          domain: this.domain
        });
        if (response.data.success) {
          console.log('NS记录:', response.data.data);
          // 这里处理查询结果，比如渲染到页面
        } else {
          console.error('查询失败:', response.data.error);
        }
      } catch (err) {
        console.error('请求出错:', err);
      }
    }
  }
};
</script>

方案二：使用浏览器兼容的公开DNS API（无需自建后端） #

借助第三方提供的DNS-over-HTTPS接口，直接在前端发起查询，比如Cloudflare的公开DNS服务：

<template>
  <div>
    <input v-model="domain" placeholder="输入域名">
    <button @click="goToSecondStep">查询NS记录</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      domain: ''
    };
  },
  methods: {
    async goToSecondStep() {
      if (!this.domain.trim()) return;
      try {
        const encodedDomain = encodeURIComponent(this.domain);
        const response = await fetch(`https://cloudflare-dns.com/dns-query?name=${encodedDomain}&type=NS`, {
          headers: {
            'Accept': 'application/dns-json'
          }
        });
        const result = await response.json();
        if (result.Status === 0) {
          // 提取NS记录
          const nsRecords = result.Answer.map(item => item.data);
          console.log('NS记录:', nsRecords);
          // 处理结果
        } else {
          console.error('查询失败:', result);
        }
      } catch (err) {
        console.error('请求出错:', err);
      }
    }
  }
};
</script>

额外的代码修正 #

如果后续在服务端使用getNs函数，需要修正异步逻辑（原函数没有返回Promise，调用方无法获取结果）：

// @/plugins/getNs.js
export async function getNs(domain) {
  const dns = require('node:dns');
  const dnsPromises = dns.promises;
  const options = {
    family: 6,
    hints: dns.ADDRCONFIG | dns.V4MAPPED,
    all: true
  };
  
  try {
    const result = await dnsPromises.resolveNs(domain, options);
    console.log('addresses: %j', result);
    return result;
  } catch (err) {
    console.error('DNS查询错误:', err);
    throw err; // 抛出错误让调用方处理
  }
}

内容的提问来源于stack exchange，提问作者rozhan