javascript - 在网页上,如何为链接设置接受 header?

在客户端,我不知道如何设置Accept头,除非我使用XHR或其他一些"非浏览器"客户端,在使用window.location时,有没有办法在HTML中设置链接或JS中的Accept标头?

时间: 作者:

没有一种方法可以完成这个,我认为,最好的方法是使用数据uri (http://en.wikipedia.org/wiki/Data_URI_scheme),让AJAX为你完成工作:


// aware that you didn't mention jQuery, but you can do this with or without
var download = function(){
 var mime = this.getAttribute('data-mime-type');
 $.ajax({
 accepts: mime,
 success: function(data){
 var uri = 'data:'+mime+';charset=UTF-8,' + encodeURIComponent(data);
 window.location = uri;
 }
 })
 return false;
}

在下面的例子中使用了同样的思路:

<a href="/some-csv-endpoint" data-mime-type="text/csv">Download CSV</a>

document.querySelectorAll('a[data-mime-type]').onclick = download;


我认为你可以使用很少数量的服务器在任何语言中都应该很容易,示例是PHP:


function get_accepted_headers() {
 $headers = apache_request_headers();
 if(array_key_exists('Accept', $headers)) {
 $accepted = explode(',', $headers['Accept']);
 return $accepted;
 }
 return array();
}

将data-accept属性添加到下载链接:

<a href="/some-csv-file.csv" data-accept="text/csv">Download CSV</a>

然后附加click事件处理程序,以确保用户接受指定的内容类型:


// will end up with something like: ["text/html","application/xhtml+xml","application/xml;q=0.9","image/webp","*/*;q=0.8"]
var user_headers = <?=stripslashes(json_encode(get_accepted_headers()))?>;
var click_header_check = function() {
 var accept = this.getAttribute('data-accept');
 if(user_headers.indexOf(accept) == -1) {
 console.log('User does not explicitly accept content-type: %s', accept);
 return false;
 }
 window.location = this.href;
 return;
}

// attach the event listener
document.querySelector('a[data-accept]').onclick = click_header_check;

我想我可以把这个放到这里,让后面的数千人看看这个帖子。 你做不到。

作者:
...