Javascript 如何从浏览器地址栏中获取URL?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4178578/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 11:16:12  来源:igfitidea点击:

How to get URL from browser address bar?

javascripturl

提问by Constructor

I wanted to do some js analytics, so I would need to know how to get whatever the user entered in the address bar as a js variable so I can know what are the most common misspellings. That way I can make redirects for the most common misspellings to the correct adresses and reduce 404 page requests.

我想做一些 js 分析,所以我需要知道如何获取用户在地址栏中输入的任何内容作为 js 变量,以便我知道最常见的拼写错误是什么。这样我就可以将最常见的拼写错误重定向到正确的地址并减少 404 页面请求。

example of user input in browser:

浏览器中的用户输入示例:

https://stackoverflow.com/questions

https://stackoverflow.com/questions

.........................................

………………………………………………………………………………………………………………………………………………………………………………………………

I have tried using

我试过使用

document.location

but that shows what page the user is on (i.e. 404 page address), not what they have typed

但这显示了用户所在的页面(即 404 页面地址),而不是他们输入的内容

回答by jwueller

This gives you the exact url the user is on:

这为您提供了用户所在的确切网址:

document.location.href

There is no way of determining what the user typed before the request is submitted (for security-reasons).

无法确定用户在提交请求之前键入了什么(出于安全原因)。

回答by KARTHIKEYAN.A

JavaScript provides you many methods to get the current URL displaying in web browser address bar. You can use Location object property of the Window object to get these details.

JavaScript 提供了多种方法来获取当前 URL 显示在 Web 浏览器地址栏中。您可以使用 Window 对象的 Location 对象属性来获取这些详细信息。

  1. href => This will return the entire URL displaying in the address bar.
  2. host => This will return the hostname and port of the URL in address bar.
  3. hostname => This will return only the hostname of the URL in address bar.
  4. port => This will return only the port detail of the URL in address bar.
  5. protocol => This will return the protocol of the URL in address bar. Like the URL is using HTTP (without SSL) or HTTPS (with SSL).
  6. pathname => This will return the pathname (value after the domain name) of the URL in address bar.
  7. hashpathname => This will return the anchor portion of the URL including hash singh (#).
  8. search=> This will return the query portion of the URL like portion started with the question mark (?).
    console.log(' href => ' + window.location.href);
    console.log(' host => ' + window.location.host);
    console.log(' hostname => ' + window.location.hostname);
    console.log(' port => ' + window.location.port);
    console.log(' protocol => ' + window.location.protocol);
    console.log(' pathname => ' + window.location.pathname);
    console.log(' hashpathname => ' + window.location.hash);
    console.log(' search=> ' + window.location.search);
  1. href => 这将返回显示在地址栏中的整个 URL。
  2. host => 这将在地址栏中返回 URL 的主机名和端口。
  3. 主机名 => 这将仅返回地址栏中 URL 的主机名。
  4. port => 这将仅返回地址栏中 URL 的端口详细信息。
  5. protocol => 这将在地址栏中返回 URL 的协议。就像 URL 使用 HTTP(不带 SSL)或 HTTPS(带 SSL)一样。
  6. pathname => 这将返回地址栏中 URL 的路径名(域名后的值)。
  7. hashpathname => 这将返回 URL 的锚点部分,包括 hash singh (#)。
  8. search=> 这将返回 URL 的查询部分,如以问号 (?) 开头的部分。
    console.log(' href => ' + window.location.href);
    console.log(' host => ' + window.location.host);
    console.log(' hostname => ' + window.location.hostname);
    console.log(' port => ' + window.location.port);
    console.log(' protocol => ' + window.location.protocol);
    console.log(' pathname => ' + window.location.pathname);
    console.log(' hashpathname => ' + window.location.hash);
    console.log(' search=> ' + window.location.search);

reference:https://tecadmin.net/get-current-url-web-browser-using-javascript/

参考:https : //tecadmin.net/get-current-url-web-browser-using-javascript/

回答by Pointy

You're going to have to do this on the server, since that's where the original 404 response comes from. The server definitely receives the bad URL, so all that has to happen is that you make your server preserve those somewhere.

您将不得不在服务器上执行此操作,因为这是原始 404 响应的来源。服务器肯定会接收到错误的 URL,因此所要做的就是让服务器将这些 URL 保留在某处。

回答by Chris Fletcher

Many content management systems preserve the url when you land on the 404 page, so you should be able to use document.location.href, then just check the analytics on the error page.

许多内容管理系统会在您登陆 404 页面时保留 url,因此您应该可以使用document.location.href,然后只需检查错误页面上的分析。

回答by Mark Ritterhoff

This is a good way to get the Reload link address, if there is one, which should have the URL that was typed in to the address bar.

这是获取 Reload 链接地址的好方法,如果有的话,它应该包含在地址栏中输入的 URL。

var arr = [], l = document.links;
for(var i=0; i<l.length; i++) {
  arr.push(l[i].href);
}

from: https://stackoverflow.com/a/3871370/1188090

来自:https: //stackoverflow.com/a/3871370/1188090

回答by sanders

javascript: alert(window.location.hostname);

If you want to show the pathname, replace .hostnamewith .pathname.

如果要显示路径名,请替换.hostname.pathname.