Edge与Chrome中URL API解析非HTTP协议URL的行为差异及兼容方案咨询

针对Edge与Chrome对abfss://这类非标准协议URL的解析差异，可通过以下几种方案实现一致的解析行为：

方案一：手动修正原生URL解析结果 #

直接针对Edge的异常输出做兼容修正，提取pathname中的host部分并调整相关属性：

const myUrlString = "abfss://myprojectname/filename.csv";
const myUrl = new URL(myUrlString);

// 检测Edge的解析异常：host为空且pathname以//开头
if (!myUrl.host && myUrl.pathname.startsWith('//')) {
  const [hostPart, ...pathSegments] = myUrl.pathname.slice(2).split('/');
  myUrl.hostname = hostPart;
  myUrl.host = hostPart;
  myUrl.pathname = '/' + pathSegments.join('/');
}

console.log(myUrl);

方案二：自定义URL解析函数 #

不依赖浏览器原生API，自己实现协议、host、路径的拆分逻辑，确保跨浏览器行为完全一致：

function parseCustomProtocolUrl(urlString) {
  const protocolRegex = /^([a-z0-9+.-]+):\/\//i;
  const matchResult = urlString.match(protocolRegex);
  
  if (!matchResult) {
    throw new Error('无效的URL格式');
  }

  const protocol = matchResult[1];
  const contentAfterProtocol = urlString.slice(protocol.length + 3);
  const [hostPart, ...pathParts] = contentAfterProtocol.split('/');

  return {
    protocol: `${protocol}:`,
    host: hostPart,
    hostname: hostPart,
    pathname: pathParts.length ? '/' + pathParts.join('/') : '/',
    href: urlString
    // 可根据需求补充search、hash等其他URL属性
  };
}

// 使用示例
const myUrlString = "abfss://myprojectname/filename.csv";
const myUrl = parseCustomProtocolUrl(myUrlString);
console.log(myUrl);

方案三：临时转换为HTTP协议解析 #

利用浏览器对HTTP协议解析的一致性，先将目标协议替换为http://完成解析，再还原原协议：

const myUrlString = "abfss://myprojectname/filename.csv";
// 临时替换协议为http://以获取正确的host和路径
const tempParsedUrl = new URL(myUrlString.replace(/^abfss:/, 'http:'));
// 初始化原URL对象并修正属性
const myUrl = new URL(myUrlString);
myUrl.host = tempParsedUrl.host;
myUrl.hostname = tempParsedUrl.hostname;
myUrl.pathname = tempParsedUrl.pathname;

console.log(myUrl);

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