添加头信息

以下提供了2种设置头信息的方法

$.ajax({
        url: '/test',
        headers: {// 设置方法1:使用headers属性来设置
          a: 1,
          b: 2,
          Referer: 'http://localhost:3000/index.html'// 这句话试图在请求头中添加网站来源,由于浏览器的安全限制,该句不会生效,且报出'Refused to set unsafe header "Referer"'的错误
        },
        beforeSend(xhr) {
          // 设置方法2:使用setRequestHeader方法来设置
          xhr.setRequestHeader('c', 3)
          xhr.setRequestHeader('d', 4)
        },
      })

注意:并不是所有被添加的头信息都能生效,如:Referer

关于Referer

1 防止csrf

因为csrf是欺骗用户打开某个恶意网站,然后在这个网站隐性的发送被攻击网站的请求,如果Referer信息不受信任,被攻击网站可以拒绝此次恶意访问

2 用于统计网站流量来源

点击a链接,跳转至本站时,通常浏览器会带上Referer头信息,来标识来源,本站拿到这个信息,可以做统计分析

3 防盗链

用户访问本站资源时,后台拿到Referer头信息判断该用户来源是否在服务范围内,如果不在,可以响应403拒绝提供资源,或者响应302重定向到其他资源,以流量计费的网站适用此项技术,试想别人盗用你的资源,同时也浪费了你网站的流量,使用此项技术,可减少资源被盗用的风险

如下示例,是百度防盗链图片,没有Referer头信息时(在地址栏直接打开不带有Referer头信息)或者Referer头信息是baidu.com时,均可正常访问,如果不是,就会重定向到其他图片:

<img src="http://c.hiphotos.baidu.com/image/w%3D210/sign=ed30880babec8a13141a50e1c7029157/d52a2834349b033be1a9503e17ce36d3d539bd35.jpg?qq-pf-to=pcqq.group">

使用img标签访问以上图片,会显示:

jquery默认增加请求头 jquery 请求头_d3

如果使用地址栏直接打开图片url,则会正常显示:

jquery默认增加请求头 jquery 请求头_jquery默认增加请求头_02

破解防盗链

方法原理:破解防盗链的方法很简单,可以去除Referer头信息(伪造是直接在地址栏中打开)或者修改Referer头信息(伪造是可信网站来源)

node修改头信息示例:

// 使用superagent发起后台请求
const request = require('superagent')

app.all('/get', (req, res) => {
    request
        // 访问图片链接
        .get('http://c.hiphotos.baidu.com/image/w%3D210/sign=ed30880babec8a13141a50e1c7029157/d52a2834349b033be1a9503e17ce36d3d539bd35.jpg?qq-pf-to=pcqq.group')
        // 设置头信息(如果不设置,也是能正常下载到本地的,因为伪造了在地址栏中直接打开的假象,但是设置错误的话,就会重定向到其他图片了)
        .set('Referer', 'https://www.baidu.com')
        // 写入本地
        .pipe(fs.createWriteStream('test.png'))
})

结果:

jquery默认增加请求头 jquery 请求头_地址栏_03