JavaScript - Browser - HTTP(Content Negotiation, XMLHttpRequest, getResponseHeader, setRequestHeader)

Eloquent JavaScript

開発環境

• macOS Sierra - Apple (OS)
• Emacs (Text Editor)
• JavaScript (プログラミング言語)
• Safari、Firefox(Web browser)

Eloquent JavaScript(Marijn Haverbeke 著、No Starch Press)のPart 2(Browser)、Chapter 17(HTTP)、Exercises(Content Negotiation)を取り組んでみる。

Exercises(Content Negotiation)

コード(Emacs)

HTML5

<div id="d0"></div>
<script src="sample1.js"></script>

JavaScript

'use strict';
let url = 'http://eloquentjavascript.net/author',
    div = document.querySelector('#d0'),
    req = new XMLHttpRequest();

['application/rainbows+unicorns',
 'aplication/json',
 'text/plain',
 'text/html',
].forEach((type) => {
    div.innerHTML += `type: ${type}<br>`;
    try {
        req.open('GET', url, false);
        req.setRequestHeader( 'Content-Type', type); 
        req.send(null);

        div.innerHTML +=
            `${req.status}, ${req.statusText}<br>` +
            `${req.getResponseHeader('content-type')}<br>` +
            `${req.responseText}<br>`;
    } catch (e) {
        div.innerHTML += `${e}<br>`;
    }
});