快速获取请求来源 - JavaScript

在Web开发中，我们经常需要获取请求的来源是哪个网页、哪个应用程序等等。JavaScript提供了一些API和方法可以帮助我们方便地获取请求来源。

获取当前网页的URL

要获取当前网页的URL，我们可以使用window.location.href属性或document.URL属性。这两个属性返回的值都是当前网页的完整URL，包括协议、主机名、端口号、路径和查询参数等信息。

// 获取当前网页的URL
let url = window.location.href; // 或者 let url = document.URL;
console.log(url); // 输出：https://www.example.com/index.html?foo=bar

获取当前网页的协议、主机名和端口号

如果我们只需要获取当前网页的协议、主机名和端口号，可以使用window.location.protocol、window.location.hostname和window.location.port属性。

// 获取当前网页的协议、主机名和端口号
let protocol = window.location.protocol; // 返回协议，比如http:
let hostname = window.location.hostname; // 返回主机名，比如www.example.com
let port = window.location.port; // 返回端口号，比如80
console.log(protocol + '//' + hostname + ':' + port); // 会输出：https://www.example.com:80（如果端口号是80的话，实际上会省略掉）

获取请求来源的网页URL

有时候我们需要获取当前请求的来源是哪个网页，比如用户从那个网页跳转过来的。我们可以使用document.referrer属性来获取请求来源的网页URL。但需要注意的是，某些浏览器或插件可能会禁用该属性，或者只能在同一个域名下才能获取到正确的值。

// 获取请求来源的网页URL
let referrer = document.referrer;
console.log(referrer); // 如果当前网页是从www.example.com/page1.html链接过来的，会输出：https://www.example.com/page1.html

获取请求的User-Agent

User-Agent是请求的头部字段之一，用来描述当前请求的浏览器或应用程序等信息。我们可以通过读取请求头来获取User-Agent，或者使用navigator.userAgent属性直接获取当前浏览器的User-Agent。

// 获取请求的User-Agent
let userAgent = navigator.userAgent;
console.log(userAgent);

以上就是几个常见的获取请求来源的方法和属性，使用起来十分简单，可以方便地应用于实际开发中。