javascriptでレスポンスヘッダーが取得できない

Question

初めまして、お世話になります。

###前提・実現したいこと
QiitaのAPIを使用してクライアントアプリを作成しようとしています。
レスポンスヘッダーの値「Total-Count」を取得したいのですが
「content-type」、「cache-control」以外の値が取得できません。

一部ヘッダーが取れていますし、CORSの問題ではなさそうなのですが
何が悪いのかアドバイス頂けないでしょうか？
＃「Access-Control-Expose-Headers」に「Total-Count」が指定されていれば取得できるのでしょうか。

###発生している問題・エラーメッセージ

上側の図がChromeの開発者ツールのネットワークタブの内容
下図がレスポンスヘッダーの内容をコンソールに出力したものです。

レスポンスとして「Total-Count」が返却されているのに取得することができません。

###該当のソースコード
https://jsfiddle.net/u4sLxcqg/

###試したこと
当初はaxiosでAPIを読んでいたので取得できないのかと思い
XMLHttpRequestでAPIを呼んでみましたが結果は変わりませんでした。
（上記、ソースコードに記述しています）

###補足情報(言語/FW/ツール等のバージョンなど)
javascript
axios：v0.15.3

少しでもアドバイス頂けると助かります。
どうぞよろしくお願いします。

Answer 1

残念ながら、ブラウザ内だけではどうしようもありません。

「Cache-Control」「Content-Language」「Content-Type」「Expires」「Last-Modified」「Pragma」の6つ以外のヘッダーを、ブラウザ内のJavaScriptコードが受け取るには、サーバ側がAccess-Control-Expose-Headersヘッダを投げてくれる必要があります（英語版MDN）。

Comments

[yum62]

早速のご回答ありがとうございます。

やはりそうなんですね。
Qiitaの投稿でjavascriptから取得されている記事があったので
ソースコードが何か誤っているのではと思い質問しました。

リンクもありがとうございます！自分で解決できるよう勉強します。