什么DNS域名解析，域名解析的全过程

奶茶不加冰七分甜
140 阅读4分钟

1.什么是DNS？

DNS，全称域名系统（Domain Name System）。是因特网的电话簿。人类通过域名在线访问信息，如nytimes.com或espn.com。Web浏览器通过Internet协议（IP）地址进行交互，而DNS将域名转换为IP地址

2.DNS的作用？

DNS将域名解析为IP地址

3.DNS域名解析的全过程

详细解释DNS域名解析的过程：

网络客户端就是我们平常使用的电脑，打开浏览器，输入一个域名。比如输入www.163.com，这时，你使用的电脑会发出一个DNS请求到本地DNS服务器。本地DNS服务器一般都是你的网络接入服务器商提供，比如中国电信，中国移动。

查询www.163.com的DNS请求到达本地DNS服务器之后，本地DNS服务器会首先查询它的缓存记录，如果缓存中有此条记录，就可以直接返回结果。如果没有，本地DNS服务器还要向DNS根服务器进行查询。

根DNS服务器没有记录具体的域名和IP地址的对应关系，而是告诉本地DNS服务器，你可以到域服务器上去继续查询，并给出域服务器的地址。

本地DNS服务器继续向域服务器发出请求，在这个例子中，请求的对象是.com域服务器。.com域服务器收到请求之后，也不会直接返回域名和IP地址的对应关系，而是告诉本地DNS服务器，你的域名的解析服务器的地址。

最后，本地DNS服务器向域名的解析服务器发出请求，这时就能收到一个域名和IP地址对应关系，本地DNS服务器不仅要把IP地址返回给用户电脑，还要把这个对应关系保存在缓存中，以备下次别的用户查询时，可以直接返回结果，加快网络访问。

关于DNS解析的TTL参数：

我们在配置DNS解析的时候，有一个参数常常容易忽略，就是DNS解析的TTL参数，Time To Live。TTL这个参数告诉本地DNS服务器，域名缓存的最长时间。用阿里云解析来举例，阿里云解析默认的TTL是10分钟，10分钟的含义是，本地DNS服务器对于域名的缓存时间是10分钟，10分钟之后，本地DNS服务器就会删除这条记录，删除之后，如果有用户访问这个域名，就要重复一遍上述复杂的流程。

4.实际工作中的DNS域名解析优化

问题：

（1）页面白屏时间过长

（2）页面加载慢

DNS域名解析优化：

  • 使用CDN加速：CDN即内容分发网络，它通过在全球范围内部署服务器节点来缓存网站静态资源，并根据用户地理位置选择最近的节点进行访问，从而大幅度提高网站访问速度。对于DNS解析来说，使用CDN可以将域名解析到最近的服务器节点上，避免了跨国或跨省份查询带来的延迟。
  • 合理设置TTL值：TTL即生存时间，在DNS中用于控制缓存时间。合理设置TTL值可以在保证解析速度的同时，减少缓存过期导致的解析延迟。
  • 使用多个DNS服务器：使用多个DNS服务器可以提高域名解析的可靠性和速度。通过设置权重和优先级等参数，可以控制不同DNS服务器之间的负载均衡和容错能力。
  • 页面提前异步DNS解析： 将域名放在head头部，提前预解析

dns-prefetch.js 文件，用来提取打包文件dist中的所有用到的域名，将域名提取出来放在html文件的head中进行异步dns域名解析，可以提高页面加载速度。

 "scripts": {
    "build": "vite build && node ./dns-prefetch.js"
  },

//dns-prefetch.js文件

const fs = require("fs");

//将dom字符串转为dom树，支持元素查询
const { parse } = require("node-html-parser");
const { glob } = require("glob");

const urlPattern = /(https?://[^/]*)/i;

const urls = new Set();
//遍历dist目录中的js，css文件
async function searchDomain() {
  //获取dist文件夹中的js，css文件路径
  const filesPath = await glob("dist/**/*.{css,js}");

  for (const file of filesPath) {
    //读取文件内容
    const source = fs.readFileSync(file, "utf-8");

    const match = source.match(urlPattern);
    if (match) {
      if (match && match[1]) {
        urls.add(match[1]);
      }
    }
  }
}
async function insertLinks() {
  //获取html文件
  const filesPath = await glob("dist/index.html");
  const links = [...urls]
    .map((url) => `<link rel="dns-prefetch" href="${url}">`)
    .join("\n");

  for (const path of filesPath) {
    const html = fs.readFileSync(path, "utf-8");
    //将html字符串转为dom树
    const root = parse(html);
    //查询head元素
    const head = root.querySelector("head");

    //在head标签的开始位置插入link标签
    head.insertAdjacentHTML("afterbegin", links);

    //写入htm文件
    fs.writeFileSync(path, root.toString());
  }
}
async function main() {
  await searchDomain();
  await insertLinks();
}
main();

执行dns-prefetch.js的结果

avatar
文章
阅读
粉丝