使用 Javascript / Jquery 重写 URL 前缀

Posted 2023-03-05

【中文标题】使用 Javascript / Jquery 重写 URL 前缀

【英文标题】：Rewrite URL Prefix Using Javascript / Jquery

【发布时间】：2019-11-20 22:16:54

【问题描述】：

我正在使用 javascript 从外部 API 检索一些数据，然后将这些数据显示在 html 页面上。

这个返回的数据里面是一个URL，格式如下；

var url = https://img.evbuc.com/moreStuff

我需要重写这个URL，使它以www为前缀，像这样；

var url = https://www.img.evbuc.com/moreStuff

我想使用 javascript 或 jquery 来实现。

我怎样才能做到这一点？对正确代码的解释也很棒。

【参考方案1】：

如果您想要适用于任何协议的东西，试试这个正则表达式：

var url = "https://img.evbuc.com/moreStuff"
var new_url = url.replace(/^([a-zA-Z][a-zA-Z0-9\.\+\-]*):\/\//, "$1://www.")
console.log('new URL: ', new_url)

【参考方案2】：

你不需要正则表达式，你可以简单地使用URL api

let url = "https://img.evbuc.com/moreStuff"

let parsed = new URL(url)

parsed.host = parsed.host.startsWith('www.') ? parsed.host : "www."+ parsed.host

console.log(parsed)

【讨论】：

是的。但是没有IE support（如果重要的话）

@Codekie 我们确实为URL polyfill提供了polyfills@

如果你想使用 polyfills。

如果我担心 IE 支持，我会做的就是担心 IE 支持。

【参考方案3】：

您可以使用正则表达式进行搜索和替换。

以下示例也适用于：

http://img.evbuc.com/moreStuff //img.evbuc.com/moreStuff https://img.evbuc.com/moreStuff//someMoreStuff

function prependUrl(url) 
  return url.replace(/^([^\/]*)(\/\/)(.*)/, '$1//www.$3');


const urls = [
    'https://img.evbuc.com/moreStuff',
    'http://img.evbuc.com/moreStuff',
    '//img.evbuc.com/moreStuff',
    'https://img.evbuc.com/moreStuff//someMoreStuff'
];

urls.forEach((url) => console.log(`$ url  -> $ prependUrl(url) `));

正则表达式包含 3 个捕获组：

选择直到第一个/（不包括）的所有内容 选择//（用于协议根） 选择其余的

替换值取第一个 / 之前的所有内容（也可能是空字符串）

将// 替换为//www. 附加其余部分

【参考方案4】：

简单的字符串操作：

var url = 'https://img.evbuc.com/moreStuff'
var newUrl = url.split('//')[0] + '//www.' + url.split('//')[1]
console.log(newUrl)

还有另一种方法是这样的：

var url = 'https://img.evbuc.com/moreStuff'
var newUrl = url.replace('https://', 'https://www.')
console.log(newUrl)