H5W3
当前位置:H5W3 > 其他技术问题 > 正文

【Web前端问题】JS获取上一个页面的URL

需要判断上一个页面的来源,但是有时够没有刷新,导致referrer得到的是之前的URL。

比如页面A-> B -> C -> B
A -> B document.referrer = a
B -> C document.referrer = b
C -> B 无刷新,导致返回2后,document.referrer = a, 而我想得到的是C的url。

JS在B页面获取上一个页面的URL,有哪些获取的方法,有没有办法解决这种问题?

回答:

考虑用一下HTML 5的API来改变历史记录:操纵浏览器的历史记录

回答:

前言

使用单页面的话 document.referrer 会一直为空(.html或者ssr网页则存在值)

History.length 表示用户历史会话页面的数量。当用户从新的标签页或框架载入页面其值为“1”,每访问一个页面该值增加“1”。
因为history.length 的数量只增不减,根本不能拿来做判断。

场景

需要判断用户从微信浏览器通过浏览器打开当前网页,如果是则当用户点击返回按钮时返回到web应用(站点)首页

  • 或:判断是否有前一页

    • 通过history.length

      • 不准确,如果用户曾经打开过,则会存在更多的history.length
      • 如果用户不曾打开过且直接从微信浏览器再使用系统浏览器打开,则 history.length === 1 (其中手机浏览器中为1,chrome控制台为2)
  • 或:判断用户是否访问过

  • 或:判断 history 中是否存在指定url

    • 没有找到相关方法
  • 或:判断是否是通过微信浏览器唤醒设备浏览器再打开到当前网页的

    • 没有找到相关方法

肯定还有其他方法实现 当用户点击返回按钮时返回到web应用(站点)首页 这个功能的,现在脑袋有点晕,如果有的话,也希望能得到分享,非常感谢。
对了,Vuex能否判断呢?实在是没有找到相关(内置)方法,或许有。不过即便没有的话也没关系,自己扩展一个就行。

还有

别忘记监听浏览器的返回事件啦 :

window.addEventListener("popstate", function(e) {
  alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能
}, false);

我是如何解决的

[狗头]
当用户在微信中打开web应用(站点)时,则提示用户使用浏览器打开;
再配合 Cookie和sessionStorage 缓存了router记录来判断用户点击返回按钮时是否需要直接回到home页;

回答:

把跳转方式改成每次打开一个新的页面试试

回答:

不刷新http头部带referrer,可以尝试document.location的方式去获取上源

回答:

请问你找到方法了吗

回答:

history.back?

回答:

跳转页面的时候先保存前一个页面的cookie,
然后js控制跳转。

回答:

请问这个问题解决了吗?

回答:

可以在C回到B的时候 把访问栈写在某个本地变量中 然后使用的时候 先访问这个站再访问referer

本文地址:H5W3 » 【Web前端问题】JS获取上一个页面的URL

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址