Node.jsでfontを読み込みたい

私は現在、大学で「Node.js」の「Socket.io」を使ってリアルタイムアプリを開発しています。
先ほど、HTML内で読み込んでいるCSSファイルが反映されていませんでした。
自分で調べていると、MIMEタイプを拡張子毎に変える必要がると判明し、CSSファイルは反映させることができました。
しかし、「bootstrap」のフォントだけはMIMEタイプを変更してもWEBページに反映されませんでした。

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

app.js

JavaScript
1
2//モジュールの読み込み
3var http = require('http');
4var socketio = require('socket.io');
5var fs = require('fs');
6
7//HTTPサーバを生成
8var server = http.createServer(function(req,res){
9  var path = '';
10
11  //拡張子を取得
12  var fileName = req.url;
13  var type = fileName.split('.');
14
15  //MIMEタイプ
16  var mime = {
17    'html':'text/html',
18    'css' :'text/css',
19    'js'  :'text/javascript',
20    'woff':'application/font-woff',
21    'ttf' :'application/x-font-ttf',
22    'otf' :'application/x-font-otf',
23    'svgf':'image/svg+xml',
24    'eot' :'application/vnd.ms-fontobject'
25  };
26
27  switch(key = type[type.length - 1]){
28    case 'js'  :
29    case 'css' :
30    case 'woff':
31    case 'ttf' :
32    case 'otf' :
33    case 'svgf':
34    case 'eot' :
35    case 'html':
36      res.writeHead(200,{'Content-Type' : mime[key]});
37      path += fileName;
38      break;
39
40    default:
41      path += '/index.html';
42  };
43
44  //console.log(__dirname + path);
45  res.end(fs.readFileSync(__dirname + path,'utf-8'));
46}).listen(3000);

index.html

html
1<!DOCTYPE html>
2<html lang="ja">
3
4<head>
5    <!-- Required meta tags-->
6    <meta charset="UTF-8">
7    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
8    <meta name="description" content="au theme template">
9    <meta name="author" content="Hau Nguyen">
10    <meta name="keywords" content="au theme template">
11
12    <!-- Title Page-->
13    <title>BootStrap</title>
14
15    <!-- Fontfaces CSS-->
16    <link href="CoolAdmin/css/font-face.css" rel="stylesheet" media="all">
17    <link href="CoolAdmin/vendor/font-awesome-4.7/css/font-awesome.min.css" rel="stylesheet" media="all">
18    <link href="CoolAdmin/vendor/font-awesome-5/css/fontawesome-all.min.css" rel="stylesheet" media="all">
19    <link href="CoolAdmin/vendor/mdi-font/css/material-design-iconic-font.min.css" rel="stylesheet" media="all">
20    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-animation/0.0.10/font-awesome-animation.css" type="text/css" media="all" />
21    <!-- Bootstrap CSS-->
22    <link href="CoolAdmin/vendor/bootstrap-4.1/bootstrap.min.css" rel="stylesheet" media="all">
23
24    <!-- Vendor CSS-->
25    <link href="CoolAdmin/vendor/animsition/animsition.min.css" rel="stylesheet" media="all">
26    <link href="CoolAdmin/vendor/bootstrap-progressbar/bootstrap-progressbar-3.3.4.min.css" rel="stylesheet" media="all">
27    <link href="CoolAdmin/vendor/wow/animate.css" rel="stylesheet" media="all">
28    <link href="CoolAdmin/vendor/css-hamburgers/hamburgers.min.css" rel="stylesheet" media="all">
29    <link href="CoolAdmin/vendor/slick/slick.css" rel="stylesheet" media="all">
30    <link href="CoolAdmin/vendor/select2/select2.min.css" rel="stylesheet" media="all">
31    <link href="CoolAdmin/vendor/perfect-scrollbar/perfect-scrollbar.css" rel="stylesheet" media="all">
32
33    <!-- Main CSS-->
34    <link href="CoolAdmin/css/theme.css" rel="stylesheet" media="all">
35
36    <!-- Socket.IO -->
37    <script type="text/javascript" src="/socket.io/socket.io.js"></script>
38
39</head>
40
41～(略)～
42
43    <!-- Jquery JS-->
44    <script src="CoolAdmin/vendor/jquery-3.2.1.min.js"></script>
45    <!-- Bootstrap JS-->
46    <script src="CoolAdmin/vendor/bootstrap-4.1/popper.min.js"></script>
47    <script src="CoolAdmin/vendor/bootstrap-4.1/bootstrap.min.js"></script>
48    <!-- Vendor JS       -->
49    <script src="CoolAdmin/vendor/slick/slick.min.js">
50    </script>
51    <script src="CoolAdmin/vendor/wow/wow.min.js"></script>
52    <script src="CoolAdmin/vendor/animsition/animsition.min.js"></script>
53    <script src="CoolAdmin/vendor/bootstrap-progressbar/bootstrap-progressbar.min.js">
54    </script>
55    <script src="CoolAdmin/vendor/counter-up/jquery.waypoints.min.js"></script>
56    <script src="CoolAdmin/vendor/counter-up/jquery.counterup.min.js">
57    </script>
58    <script src="CoolAdmin/vendor/circle-progress/circle-progress.min.js"></script>
59    <script src="CoolAdmin/vendor/perfect-scrollbar/perfect-scrollbar.js"></script>
60    <script src="CoolAdmin/vendor/chartjs/Chart.bundle.min.js"></script>
61    <script src="CoolAdmin/vendor/select2/select2.min.js">
62    </script>

試したこと

フォントファイルのMIMEタイプの定義が出来ていなくてフォントがダウンロードできていないと思い、自分なりに半日掛けて試行錯誤しましたがエラーは直りませんでした

何卒よろしくお願いいたします

行動規範の内容に同意します

回答1件

ベストアンサー

バイナリデータを UTF-8 でエンコードしてるからではないでしょうか。

javascript
1  var encoding;
2
3  switch(key = type[type.length - 1]){
4    case 'woff':
5    case 'ttf' :
6    case 'otf' :
7    case 'eot' :
8      encoding = 'binary';
9      break;
10
11    default:
12      encoding = 'utf-8';
13  };
14
15  res.end(fs.readFileSync(__dirname + path, encoding));
16