http链接转成https的链接的几种方法
以下是一个将HTTP链接转换为HTTPS的JavaScript函数,处理了多种常见输入情况:
function convertToHttps(url) {
if (typeof url !== 'string') return url;
// 移除首尾空格并处理空字符串
const trimmedUrl = url.trim();
if (!trimmedUrl) return 'https://';
// 替换HTTP协议(不区分大小写)
let converted = trimmedUrl.replace(/^http:\/\//i, 'https://');
// 处理协议相对地址(以//开头)
if (converted.startsWith('//')) {
return 'https:' + converted;
}
// 处理无协议地址
if (!/^https?:\/\//i.test(converted)) {
// 处理类似 "example.com/path" 或 "www.example.com" 的情况
return converted.startsWith('/')
? `https:/${converted}`
: `https://${converted}`;
}
return converted;
}
功能说明:
-
协议转换:
- 将
http://
或HTTP://
转换为https://
- 保留已存在的
https://
协议不变
- 将
-
协议相对地址处理:
- 输入
//example.com
→ 转换为https://example.com
- 输入
-
无协议地址处理:
- 输入
example.com
→ 转换为https://example.com
- 输入
/api/data
→ 转换为https:///api/data
(需根据业务场景调整)
- 输入
-
特殊字符处理:
// 保留端口号和路径 convertToHttps('http://example.com:8080/api?v=1') // → "https://example.com:8080/api?v=1" // 处理用户认证信息 convertToHttps('http://user:pass@example.com') // → "https://user:pass@example.com"
测试用例:
// 基础转换
console.log(convertToHttps('http://example.com')); // "https://example.com"
console.log(convertToHttps('https://secure.com')); // "https://secure.com"
console.log(convertToHttps('HTTP://BIGSITE.COM')); // "https://BIGSITE.COM"
// 协议相对地址
console.log(convertToHttps('//cdn.example.com')); // "https://cdn.example.com"
// 无协议地址
console.log(convertToHttps('example.com/path')); // "https://example.com/path"
console.log(convertToHttps('www.example.com')); // "https://www.example.com"
console.log(convertToHttps('/api/data')); // "https:///api/data"
// 特殊场景
console.log(convertToHttps('http://user:pass@site.com')); // "https://user:pass@site.com"
console.log(convertToHttps('http://localhost:3000')); // "https://localhost:3000"
增强建议:
-
域名白名单:
const WHITELIST = ['localhost', '127.0.0.1']; function shouldConvert(url) { const domain = new URL(url).hostname; return !WHITELIST.includes(domain); }
-
混合内容检测:
function hasMixedContent(pageUrl, resourceUrl) { const pageProtocol = new URL(pageUrl).protocol; const resProtocol = new URL(resourceUrl).protocol; return pageProtocol === 'https:' && resProtocol === 'http:'; }
-
自动重定向处理:
async function secureFetch(url) { const secureUrl = convertToHttps(url); try { return await fetch(secureUrl); } catch (err) { if (err.message.includes('SSL')) { console.warn('回退到HTTP'); return fetch(url.replace('https://', 'http://')); } throw err; } }
该函数可满足大多数场景的HTTP到HTTPS转换需求,建议根据具体业务场景调整协议回退策略和特殊域名处理逻辑。