How can I set the Accept Header for a link on a web page?

后端 未结 3 1388
甜味超标
甜味超标 2020-12-15 04:45

This is mostly an ivory tower question, since I can easily just make a new URL endpoint. But basically, I\'d like to be able to serve up CSV when the user has the Accept he

3条回答
  •  暖寄归人
    2020-12-15 05:19

    Update:

    I will leave my original answer below for posterity, but I now see that I didn't really answer the question. There isn't a way to do this "natively", the best approach I can think of would be to use a data uri (http://en.wikipedia.org/wiki/Data_URI_scheme) and have AJAX do the work for you:

    // 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;
    }
    

    With the same idea used in the example below:

    Download CSV

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


    Original Answer

    There is no built-in way to force an 'Accept' header on a link (via HTML or Javascript). I think you could pull this off fairly easily using a very small amount of server & client-side code though. Should be easy in any language, my example is PHP:

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

    Add a data-accept attribute to your download links:

    Download CSV

    Then attach a click event handler to ensure that the user accepts the specified content type:

    // will end up with something like: ["text/html", "application/xhtml+xml", "application/xml;q=0.9", "image/webp", "*/*;q=0.8"]
    var user_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;
    

    Not sure if this is what you were looking for, but hope that it helps.

提交回复
热议问题