Web API URL.origin 属性

简介

在Web开发中，URL对象用于将URL地址解析为可编程的对象，通过URL对象，开发者可以轻松访问URL的各种属性，如协议、主机名、端口、路径等。其中，URL.origin 属性用于返回URL的源信息，包括协议、主机和端口号。

语法

const origin = url.origin;

返回值

返回一个字符串，表示指定URL的源信息，格式为 协议://主机:端口。

注意事项

• 如果协议是HTTP，且端口号是80，则端口号可以省略。
• 如果协议是HTTPS，且端口号是443，则端口号可以省略。

示例

const url = new URL('https://www.example.com:8080/path/to/resource');
console.log(url.origin); // 'https://www.example.com:8080'

const url2 = new URL('http://example.com/');
console.log(url2.origin); // 'http://example.com'

const url3 = new URL('https://example.com:443/');
console.log(url3.origin); // 'https://example.com'

返回结果

https://www.example.com:8080
http://example.com
https://example.com

总结

URL.origin 属性可以方便地获取URL的源信息，避免了手动拼接协议、主机和端口号的麻烦，尤其在跨域安全实践中使用较为广泛。但需要注意的是，如果需要使用URL.pathname 属性获取路径信息，必须至少有一个斜杆 / 出现在路径中，否则URL.pathname 属性将返回空字符串。