js 获取uri

在JavaScript中获取URI（Uniform Resource Identifier，统一资源标识符）通常指的是获取当前页面的URL或者URL中的特定部分。以下是一些基础概念和方法：

基础概念

• URL：是因特网上标准的资源的地址，通常由协议（如HTTP或HTTPS）、域名（如www.example.com）和资源路径（如/path/to/file）组成。
• URI：是一个更广泛的概念，可以包括URL以及其他形式的标识符。

获取整个URL

你可以使用window.location.href来获取当前页面的完整URL。

var currentURL = window.location.href;
console.log(currentURL);

获取URL的不同部分

window.location对象提供了多个属性来获取URL的不同部分：

• window.location.protocol：获取URL的协议部分（包括冒号），例如"http:"或"https:"。
• window.location.hostname：获取URL的主机名，例如"www.example.com"。
• window.location.port：获取URL的端口号，如果没有指定端口，则返回空字符串。
• window.location.pathname：获取URL的路径名，例如"/path/to/file"。
• window.location.search：获取URL的查询字符串部分，包括问号（?），例如"?id=123"。
• window.location.hash：获取URL的片段标识符，包括井号（#），例如"#section1"。

获取查询参数

如果你需要获取URL中的特定查询参数，可以使用以下方法：

function getQueryParamByName(name, url = window.location.href) {
    let queryStr = url.split('?')[1];
    if (!queryStr) return null;
    let paramsArray = queryStr.split('&');
    for (let i = 0; i < paramsArray.length; i++) {
        let param = paramsArray[i].split('=');
        if (decodeURIComponent(param[0]) === name) {
            return decodeURIComponent(param[1] || '');
        }
    }
    return null;
}

let id = getQueryParamByName('id');
console.log(id); // 输出查询参数id的值

应用场景

• 单页应用（SPA）路由：在单页应用中，你可能需要根据URL的变化来更新页面内容。
• 分析用户行为：通过分析URL，可以了解用户是如何到达当前页面的。
• 动态内容加载：根据URL的不同部分或查询参数，加载不同的内容。

常见问题及解决方法

• 跨域问题：如果你尝试从不同的域获取URL信息，可能会遇到跨域资源共享（CORS）问题。解决这个问题通常需要在服务器端设置适当的CORS头部。
• URL编码问题：URL中的特殊字符会被编码，例如空格会被编码为%20。使用decodeURIComponent函数可以将这些编码的字符解码回原始字符。

以上是关于在JavaScript中获取URI的基础知识和方法。如果你有更具体的问题或遇到特定的问题，请提供详细信息以便进一步解答。