[Feature]: 完善 {% link %} 标签功能

[828767]

功能简介

完善 {% link %} 标签功能

问题描述

当前存在的问题：

1. 一律视为站外链接，不区分站内站外地址
2. 图标自动接口获取url/favicon.png，当url为相对路径时异常：
   1. 获取 favicon.png 失败
   2. 生成的链接href="这里还会多出空格"
3. 网站不存在 favicon.png 时无图标

实现效果

1. 区分站内和站外链接
2. 站内链接自动应用配置的favicon，站外链接应用标签中指定的图标文件或自动获取的图标

效果实例展示

你想到的可行的替代方案

const urlFor = require("hexo-util").url_for.bind(hexo);
function link(args) {
  const themeConfig = hexo.theme.config;
  args = args.join(" ").split(",");
  let title = args[0];
  let sitename = args[1];
  let link = args[2];
  let imgUrl = args[3] || "";
  let favicon = themeConfig.site.siteIcon;

  // 删除头尾空白符
  link = link.trim();
  imgUrl = imgUrl.trim();
  favicon = favicon.trim();

  // 链接指定为有效URL视为站外，其他相对路径等视为站内
  try {
    new URL(link);
    InsideStation = false;
  } catch (err) {
    InsideStation = true;
  }

  // let urlNoProtocol = args[2].replace(/^https?\:\/\//i, "");
  // let imgUrl = "https://api.iowen.cn/favicon/" + urlNoProtocol + ".png";

  return `<a class="tag-link" target="_blank" href="${urlFor(link)}">
    <div class="tag-link-tips">${
      InsideStation ? "站内地址" : "引用站外地址"
    }</div>
    <div class="tag-link-bottom">
        <div class="tag-link-left" style="${
          imgUrl
            ? `background-image: url(${InsideStation ? favicon : imgUrl})`
            : ""
        }">
            <i class="solitude st-link-m-line" style="${
              imgUrl ? "display: none" : ""
            }"></i>
        </div>
        <div class="tag-link-right">
            <div class="tag-link-title">${title}</div>
            <div class="tag-link-sitename">${sitename}</div>
        </div>
        <i class="solitude st-arrow-right-bold"></i>
    </div>
    </a>`;
}

hexo.extend.tag.register("link", link, { ends: false });

其他内容

No response

[828767]

图标显示理想状态应该可以做成：

1. 有指定则应用指定图标
2. 无指定：
   1. 站内自动应用favicon
   2. 站外自动自动获取
   3. 获取失败

[everfu]

可以自己交一个PR，完善一下

[828767]

可以自己交一个PR，完善一下

可我是个菜鸟啊，还不知道怎么单独把这个文件PR o(╯□╰)o

const urlFor = require("hexo-util").url_for.bind(hexo);
function link(args) {
  const themeConfig = hexo.theme.config;
  args = args.join(" ").split(",");
  let title = args[0];
  let sitename = args[1];
  let link = args[2];
  let imgUrl = args[3] || "";
  let favicon = themeConfig.site.siteIcon;

  // 删除头尾空白符
  link = link.trim();
  imgUrl = imgUrl.trim();
  favicon = favicon.trim();

  // 链接指定为有效URL视为站外，其他相对路径等视为站内
  try {
    new URL(link);
    InsideStation = false;
  } catch (err) {
    InsideStation = true;
  }

  if ((imgUrl == "") && (InsideStation == false)) {
    let domain = new URL(link).hostname
    if (domain) {
      imgUrl_online = "https://api.iowen.cn/favicon/" + domain + ".png";
    }
  }

  return `<a class="tag-link" target="_blank" href="${urlFor(link)}">
    <div class="tag-link-tips">${
      InsideStation ? "站内链接" : "引用站外链接"
    }</div>
    <div class="tag-link-bottom">
        <div class="tag-link-left" style="${
          InsideStation
            ? `background-image: url(${imgUrl ? imgUrl : favicon})`
            : `background-image: url(${imgUrl ? imgUrl : imgUrl_online})`
        }">
            <i class="solitude st-link-m-line" style="${
              `(imgUrl) || (imgUrl_online)` ? "display: none" : ""
            }"></i>
        </div>
        <div class="tag-link-right">
            <div class="tag-link-title">${title}</div>
            <div class="tag-link-sitename">${sitename}</div>
        </div>
        <i class="solitude st-arrow-right-bold"></i>
    </div>
    </a>`;
}

hexo.extend.tag.register("link", link, { ends: false });