首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js 获得referer

在JavaScript中,Referer(通常拼写为“Referrer”)是一个HTTP头部字段,它包含了用户在访问当前页面之前所在的页面的URL。这个信息可以用于追踪用户的来源,分析流量,或者是实施某些基于来源的安全策略。

如何获取Referer

在JavaScript中,可以通过document.referrer属性来获取当前页面的Referer。例如:

代码语言:txt
复制
console.log(document.referrer);

这段代码会在控制台打印出来访者之前访问的页面URL。

优势

  • 流量分析:网站管理员可以通过Referer信息了解用户是从哪个网站跳转过来的,从而分析流量来源。
  • 安全策略:有些网站可能会检查Referer,以防止内容被非法引用或者是点击劫持攻击。
  • 用户体验:可以根据用户的来源提供更加个性化的内容或者导航。

类型

Referer信息通常是一个URL,但它也可能是一个空字符串,这通常发生在以下情况:

  • 用户直接在浏览器中输入了URL。
  • 用户通过书签访问页面。
  • 浏览器的隐私设置阻止了Referer信息的发送。

应用场景

  • 广告跟踪:通过Referer信息,可以追踪广告点击后的转化情况。
  • 防盗链:网站可以通过检查Referer来阻止其他网站直接引用其资源。
  • 内容推荐:根据用户的来源页面,推荐相关的内容或者产品。

遇到的问题及解决方法

问题:Referer信息不准确或者为空

这可能是因为用户的浏览器设置、隐私插件或者是直接输入URL访问导致的。

解决方法

  • 确认用户的浏览器设置没有禁用Referer信息的发送。
  • 检查是否有隐私插件或者扩展程序影响了Referer信息的传递。
  • 对于直接输入URL访问的情况,可以设计一个默认的行为或者页面,以适应这种情况。

问题:Referer信息被伪造

恶意用户可能会伪造Referer信息,以达到欺骗或者攻击的目的。

解决方法

  • 不要完全依赖Referer信息来做安全决策,因为它可以被伪造。
  • 使用更加安全的机制,如CSRF令牌,来保护网站不受跨站请求伪造攻击。

问题:隐私问题

由于Referer信息可能泄露用户的浏览行为,因此可能会引起隐私方面的担忧。

解决方法

  • 遵守相关的隐私法规,合理使用Referer信息。
  • 提供用户选项,允许用户控制是否发送Referer信息。
  • 使用Referrer-Policy HTTP头部来控制Referer信息的发送范围,例如只发送源域名而不是完整的URL。

注意事项

  • 由于隐私保护的原因,未来浏览器可能会更加严格地限制Referer信息的发送。
  • 应当谨慎处理Referer信息,避免侵犯用户隐私。
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

使用Referer Meta标签控制referer 来源

本文描述了一个关于 http 协议中 referer 的 metadata 参数的提议,使用这个 metadata 参数,html 文档可以控制 http 请求中的 referer ,比如是否发送 referer...虽然有一些方法可以控制 referer ,比如 flash,以及一些 js 的 tricks,但是本文中描述的是另外一番景象。...的值即 meta 标签中 content 的值): 1.如果 referer-policy 的值为never:删除 http head 中的 referer; 2.如果 referer-policy ...估计 referer 会被忽略。...的方法,有时候允许 referer 为空,并且某些 BAT 厂商的重要业务在防御 JSON 劫持的时候,也采用校验 referer 的方法并允许 referer 为空,也许你会觉得本文中描述的只是一种提议

2.8K60
  • 使用 Referer Meta 标签控制 referer—详解 referrer-policy

    本文描述了一个关于 http 协议中 referer 的 metadata 参数的提议,使用这个 metadata 参数,html 文档可以控制 http 请求中的 referer ,比如是否发送 referer...虽然有一些方法可以控制 referer ,比如 flash,以及一些 js 的 tricks,但是本文中描述的是另外一番景象。...的值即 meta 标签中 content 的值): 1.如果 referer-policy 的值为never:删除 http head 中的 referer; 2.如果 referer-policy...估计 referer 会被忽略。...的方法,有时候允许 referer 为空,并且某些 BAT 厂商的重要业务在防御 JSON 劫持的时候,也采用校验 referer 的方法并允许 referer 为空,也许你会觉得本文中描述的只是一种提议

    2.5K50

    学习 HTTP Referer

    背景HTTP 中 Referer 字段在工作中或许并不会吸引你的注意,隐藏在 Network 的请求之下,但是却有着非常重要的作用。...HTTP Referer 是 HTTP 表头的一个字段,用来表示当前网页是来源于哪里,采用的格式是 URL。我们通过这个 HTTP Referer,可以查到访客的来源。...有了一个大概的了解,那么 Referer 字段在什么条件下会展示,以及如何去控制 Referer 返回的具体内容呢?...Referrer-Policy: strict-origin-when-cross-origin同源时,发送完整的Referer字段;跨域时,如果 HTTPS 网址链接到 HTTP 网址,不发送Referer...针对以上策略,可以根据策略及 Referer 携带信息的完整度,可以总结成一个表格,可以按照自己的需求配置不同的策略:不携带任何 Referer 信息Referer 只携带域名 Origin 信息Referer

    1.8K30

    HTTP请求头referer

    因为后台使用的是PHP,留言成功之后通过JS弹出alert提示框,然后再通过location.href跳转回留言页面。...去百度百科里面,又看到如下内容: HTTP Referer是header的一部分,当浏览器向web服务器发送请求的时候,一般会带上Referer,告诉服务器该网页是从哪个页面链接过来的,服务器因此可以获得一些信息用于处理...从上面的论述中我们可以得到如下几点结论: http_referer由浏览器生成,并不是所有浏览器都会设置该值。 http_referer可以伪造,并不可信。...HTTP_REFERER的用途 HTTP_REFERER提供了引导用户代理到当前页的前一页的地址信息。 常见的一些应用场景有: 统计文章来源。...参考链接: PHP $_SERVER 手册^1 HTTP_REFERER的用法及伪造^2 How reliable is HTTP_REFERER?

    3.4K30

    host、referer和origin的区别

    接着看一下MDN对referer的介绍: Referer 首部包含了当前请求页面的来源页面的地址,即表示当前页面是通过此来源页面里的链接进入的。...服务端一般使用 Referer 首部识别访问来源,可能会以此进行统计分析、日志记录以及缓存优化等。 需要注意的是 referer 实际上是 "referrer" 误拼写。...鼠标双击这张网页直接打开,也就是file协议访问,此时是不带referer的,图片是显示的,如图: ? network如图,此时没有referer请求头: ?...iframe去除referer的写法如下,看代码: ? 显示结果如图: ? 再看network如图: ? referer消失了。referer消失后,跳过了百度的防盗链。...这点与referer不同,浏览器如果不能获取请求源,那么请求头中不会携带referer。

    15.7K53

    【HTTP】请求“报头”,Referer 和 Cookie

    Referer 描述了当前这个页面是从哪里来的(从哪个页面跳转过来的) 浏览器中,直接输入 URL/点击收藏夹打开的网页,此时是没有 referer。...当你在 sogou 页面进行搜索时,新进入的网页就会有 referer 有一个非常典型的用途:广告中 在搜索广告中,都是按照点击计费的,双方都要进行次数统计 一个公司可能会在很多平台上投放广告,要知道这个点击是从哪个平台上来的...,就可以看 referer referer 是否会被篡改呢?...有动机 他们自己有广告系统,就可以把 referer 改成他们自己广告系统的 referer(比如,明明是从搜狗进入的改为从他们的网站进入的) 有能力 运营商提供了通信设施,在对应的路由器/交换机上部署程序...,让程序解析 HTTP 数据,把 referer 改成自己的就可以了 这种行为叫“运营商劫持”。

    12910

    技巧 ++ | 巧妙绕过 Referer 限制

    本文代码实现以图片为例 Referer 限制,老生常谈了,也就是防盗链 对于如何绕过这个东西,目前最好的方式估计是写一个 API 代替请求,毕竟 Service Worker 不能修改 Referer...,浏览器也限制了 JavaScript 对 Referer 进行修改,所以我们可以用一个 API 代替请求 确定实现目标 # 接受请求参数 提取请求参数中的 url 和所需要的 referer 对 url...response.json({ error: error.message }); response.statusCode = 500; } 请求一个网页,可以发现已经返回了网页的文本内容,然后我们加上 referer...设定 把请求改成这样就行 const options = { headers: { "Referer": "https://blog.hesiy.cn/" } } https.get...response.status(400).json({ error: 'No image URL provided' }); } const options = { headers: { 'Referer

    67810

    【第19期】HTTP请求头referer

    因为后台使用的是PHP,留言成功之后通过JS弹出alert提示框,然后再通过location.href跳转回留言页面。...去百度百科里面,又看到如下内容: HTTP Referer是header的一部分,当浏览器向web服务器发送请求的时候,一般会带上Referer,告诉服务器该网页是从哪个页面链接过来的,服务器因此可以获得一些信息用于处理...从上面的论述中我们可以得到如下几点结论: http_referer由浏览器生成,并不是所有浏览器都会设置该值。 http_referer可以伪造,并不可信。...HTTP_REFERER的用途 HTTP_REFERER提供了引导用户代理到当前页的前一页的地址信息。 常见的一些应用场景有: 统计文章来源。...参考链接: PHP $_SERVER 手册[1] HTTP_REFERER的用法及伪造[2] How reliable is HTTP_REFERER?

    3.6K20

    面试题:什么是 Referer?

    面试题:什么是 Referer? Referer 是 HTTP 协议中的一个请求头部,它记录了请求来源的信息(URL 地址)。...一般情况下,当一个用户浏览器访问一个页面时,请求头会包含 Referer 字段,告诉服务器用户从哪个网页跳转过来。该字段非常关键,可用于身份验证、防盗链等应用场景。...例如,如果一个网站有引用一张图片,那么就需要检查该图片的 Referer 字段,只有在特定的来源页面中才允许访问。同样的,防火墙也可以使用 Referer 来辨别恶意请求和安全访问服务的请求来源等。...: https://www.google.com/ 在上述请求头中,Referer 字段指明了当前访问来源为 Google 搜索引擎。...需要注意的是,Referer 的敏感性较高,因为它可能泄露用户隐私和受到攻击者的利用,比如防止 CSRF 攻击,即攻击者可以通过篡改 HTML 中的表单提交地址,寻找可利用并导致目标应用程序漏洞等。

    7810
    领券