C# 通过正则表达式实现保存时移除Html中src的域名及读取时完善域名

原因

最近遇到一个以前一直忽略的问题，在项目中如果一些富文本里需要上传图片，这些图片是保存在本地的，那存储图片路径时就涉及到要保存完整路径还是相对路径。

分析

• 在前后端不分离的项目中，图片和富文本编辑器所在的页面是同域的，使用相对路径也可以在富文本编辑器里展示图片，故而数据库中保存相对路径即可。
• 但是在前后端分离的项目中就不可以，图片无法加载，这时候需要使用完整路径才能展示图片。
  这时候如果直接在数据库中保存完整路径的话，一旦需要更换域名，到时候再更新数据库中保存的域名，那将是噩梦！

思路

要解决上述问题，需要做一些操作，比如在保存富文本内容时，把图片地址的域名给移除，需要读取富文本内容时，再把图片地址的域名加上，予以完善。

代码

• 保存时移除Html中src的域名，支持英文域名和IP地址，支持携带或不携带端口

/// <summary>
/// 移除HTML中SRC标签内容里的域名 
/// 包含英文域名或IP地址，支持携带或不携带端口
/// </summary>
/// <param name="html">HTML代码</param>
/// <returns></returns>
public static string RemoveHtmlSrcDomainName(string html)
{
    if (string.IsNullOrEmpty(html))
    {
        return "";
    }

    /*
     * 正则解释
     * 第一部分：(<\s*[^>]*?src\s*=\s*[""']?)，匹配src及之前的内容
     * 第二部分：((?:http|https)?://[a-zA-z0-9]+(?:\.[a-zA-z0-9]+)*:{0,1}\d{0,5})，匹配以http协议或https协议开头的，英文域名或IP地址，可携带最长5为数字的端口号
     * 第三部分：([^>]*?>)，匹配src之后的内容
     * 
     * 替换解释：
     * 正则表达式一共匹配出了三部分，用$1表示第一部分，$2表示第二部分，$3表示第三部分
     * 如果只是移除域名，则最终替换后的格式就是："$1$3"
     * 如果需要把域名替换为其他字符串，比如/resource/，则最终替换后的格式就是："$1/resource/$3"
     * 
     * RegexOptions.IgnoreCase：忽略大小写
     */

    return Regex.Replace(html, @"(<\s*[^>]*?src\s*=\s*[""']?)((?:http|https)?://[a-zA-z0-9]+(?:\.[a-zA-z0-9]+)*:{0,1}\d{0,5})([^>]*?>)", "$1$3", RegexOptions.IgnoreCase);
}

这种方式可以最大限度的避免把不改移除的域名给移除掉，比如富文本里的文字中正好有要移除掉的域名，如果简单粗暴的使用Replace就会把所有符合条件的域名都移除，这里就可以避免。

• 读取时完善域名

/// <summary>
/// 补充完善HTML中SRC标签内容里的域名
/// </summary>
/// <param name="html">HTML代码</param>
/// <param name="domain">域名</param>
/// <returns></returns>
public static string ComplementHtmlSrcDomainName(string html, string domain)
{
    if (string.IsNullOrEmpty(html) || string.IsNullOrEmpty(domain))
    {
       return "";
    }
    return Regex.Replace(html, @"(<\s*[^>]*?)src=([""'])(?!((http|https)?://))([^""']+)", $"$1src=$2{domain}$5", RegexOptions.IgnoreCase);
}

小结

经测试，移除和完善都可正常使用。但是这里只对具有src属性的html标签起作用，如果需要在其他属性中（比如href）也使用类似的功能，可自行进行优化。