在 JavaScript 代码中,可以使用 document.referrer 获取到引用当前页面的上级页面的地址,但是无法获取由 location.href 提交而来的上级页面的地址。在这种情况下,需要通过其他方式解决。
在 JavaScript 代码中,可以使用 document.referrer
获取到引用当前页面的上级页面的地址,但是无法获取由 location.href
提交而来的上级页面的地址。在这种情况下,需要通过其他方式解决。
一种可行的解决方法是在跳转链接的时候,将上级页面的地址作为参数传递到跳转的页面中。具体实现步骤如下:
- 在跳转链接中添加参数
<a href="http://example.com/my-page?referrer=http://previous-page.com">My Page</a>
referrer
参数的值就是上级页面的地址,这个地址可以使用 JavaScript 生成或者通过后端动态生成。
- 在接受参数的页面中获取上级页面的地址
const queryParams = new URLSearchParams(window.location.search);
const referrer = queryParams.get('referrer');
这段代码通过 URLSearchParams
对象获取到当前页面的 URL 参数,然后从参数中解析出 referrer
参数的值。
通过这种方法,我们就能够获取到由 location.href
提交而来的上级页面的地址了。
另一种可行的解决方法是使用 cookie 存储上级页面的地址。具体实现步骤如下:
- 在上级页面中设置 cookie
const referrer = window.location.href;
document.cookie = `referrer=${referrer}; path=/`;
这段代码将当前页面的地址设置为 referrer
的值,然后将其存储到 cookie 中,并设置 path
属性为根路径。
- 在接受 cookie 的页面中获取上级页面的地址
const cookies = document.cookie.split('; ');
const referrerCookie = cookies.find(cookie => cookie.startsWith('referrer='));
const referrer = referrerCookie ? referrerCookie.split('=')[1] : null;
这段代码首先通过 document.cookie
获取所有的 cookie,然后从中找到名为 referrer
的 cookie,最后获取到其值。
需要注意的是,获取到的 cookie 值是一个字符串,需要根据具体的使用场景进行解析。
通过这两种方法,我们就能够实现在 JavaScript 中获取由 location.href
提交而来的上级页面的地址。
本文标题为:关于取不到由location.href提交而来的上级页面地址的解决办法
基础教程推荐
- 全面了解CSS 2022-10-16
- 手机屏幕尺寸测试——手机的实际显示页面的宽度 2022-11-13
- flask and html connection 2023-10-29
- layui 数据表格自带的导出Excel,身份证等E+/000问题解决 2022-12-14
- ajax和jsonp跨域的原理本质详解 2023-02-14
- vuejs教程 笔记(一) 2023-10-08
- uniapp下单选框的实现方法详解 2022-10-22
- HTML5 Ajax文件上传进度条如何显示 2022-12-28
- 使用CSS3来匹配横屏竖屏的简单方法 2023-12-23
- 解决window.open()被浏览器拦截的问题 2024-01-07