ご覧いただきありがとうございます。
表題の通り、静的ファイル(css,js,png)をNginxでキャッシュさせたいと思っています。
サーバーサイドの勉強中のため至らない箇所多々あると思いますが、お許しください。
Node.jsのExpress環境です。静的ファイルのディレクトリルートは/home/manager/www/sample/public
となっており、publicフォルダ内はjavascripts,stylesheets,imagesとフォルダが別れておりそれぞれのファイルが存在しています。
html
1<!doctype html> 2<html> 3 <head> 4 <title>Socket.IO chat</title> 5 <style> 6 * { margin: 0; padding: 0; box-sizing: border-box; } 7 body { font: 13px Helvetica, Arial; } 8 form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; } 9 form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; } 10 form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; } 11 #messages { list-style-type: none; margin: 0; padding: 0; } 12 #messages li { padding: 5px 10px; } 13 #messages li:nth-child(odd) { background: #eee; } 14 </style> 15 <link rel="stylesheet" href="public/stylesheets/index.css"> 16 </head> 17 <body> 18 <ul id="messages"></ul> 19 <form action=""> 20 <input id="m" autocomplete="off" /><button>Send</button> 21 </form> 22 <a href="/page2">page2へ</a> 23 <script src="/socket.io/socket.io.js"></script> 24 <script src="https://code.jquery.com/jquery-1.11.1.js"></script> 25 <script> 26 $(function () { 27 var socket = io(); 28 $('form').submit(function(){ 29 socket.emit('chat message', $('#m').val()); 30 $('#m').val(''); 31 return false; 32 }); 33 socket.on('chat message', function(msg){ 34 $('#messages').append($('<li>').text(msg)); 35 }); 36 }); 37 </script> 38 </body> 39</html>
上記のHTMLはSocket.ioのテストページで、ページ自体は問題なく稼働(socket.io,css)しています。
次にnginx.confは下記の通りになっております。
nginx
1#nginx.conf /etc/nginx/nginx.conf 2user nginx; 3worker_processes 1; 4 5error_log /var/log/nginx/error.log warn; 6pid /var/run/nginx.pid; 7 8 9events { 10 worker_connections 1024; 11} 12 13 14http { 15 include /etc/nginx/mime.types; 16 default_type application/octet-stream; 17 18 #追加 19 #keys_zone=proxy はdefault.confのproxy_cache proxyに依存する 20 proxy_cache_path /var/cache/nginx/cache keys_zone=proxy:15m; 21 proxy_temp_path /var/cache/nginx/temp 1 2; 22 #追加(ここまで) 23 24 log_format main '$remote_addr - $remote_user [$time_local] "$request" ' 25 '$status $body_bytes_sent "$http_referer" ' 26 '"$http_user_agent" "$http_x_forwarded_for"'; 27 28 access_log /var/log/nginx/access.log main; 29 30 sendfile on; 31 #tcp_nopush on; 32 33 keepalive_timeout 65; 34 35 #gzip on; 36 37 include /etc/nginx/conf.d/*.conf; 38}
次はnginx.conf内でincludeしているdefault.confです。
Nginx
1upstream socket_nodes { 2 ip_hash; 3 server xxx.xx.xxx.xxx:3000; 4} 5 6 7server { 8 listen 80; 9 server_name xxx.xx.xxx.xxx; 10 11 #charset koi8-r; 12 #access_log /var/log/nginx/host.access.log main; 13 14 location / { 15 proxy_redirect off; 16 set $do_not_cache 0; 17 if ($request_method != GET) { 18 set $do_not_cache 1; 19 } 20 if ($uri !~* ".(png|gif|css|js)$") { 21 set $do_not_cache 1; 22 } 23 proxy_no_cache $do_not_cache; 24 proxy_cache_bypass $do_not_cache; 25 proxy_cache proxy; 26 proxy_cache_key $scheme$host$uri$is_args$args; 27 proxy_cache_valid 200 1m; 28 proxy_cache_valid any 1m; 29 30 proxy_set_header Upgrade $http_upgrade; 31 proxy_set_header Connection "upgrade"; 32 proxy_http_version 1.1; 33 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 34 proxy_set_header Host $host; 35 proxy_pass http://socket_nodes; 36 } 37}
一応/var/cache/nginx/cacheフォルダ内にはfa4c1a653fce438e6e4e5fb96435ac0dファイルが生成されているので、キャッシュできていると思うのですが、、、
linuxコマンド wsで見ると
16 1251 62983 fa4c1a653fce438e6e4e5fb96435ac0d
となっておいて、jsファイルはindex.htmlでは読み込みしておらず、読み込みに成功しているcssも
css
1a{ 2color:red 3}
socket.io.jsはバイト数:62445、行数:8となっており両方合わせても、62471,11と500バイトほどの誤差があります。
目的をcss,js,png,gifファイルをキャッシュするとした時に、上記のNginxの設定で間違い無いのでしょうか?(投げやりな質問で申し訳ございません)。
追加:
catでキャッシュファイルを見たところ、どうやら<script src="/socket.io/socket.io.js"></script>しか、キャッシュされておらず、ファイル内にindex.cssを確認できませんでした。
javascript
1var express = require('express'); 2var app = express(); 3var http = require('http').Server(app); 4var io = require('socket.io')(http); 5var fs = require('fs'); 6 7const MongoClient = require('mongodb').MongoClient; 8const f = require('util').format; 9const assert = require('assert'); 10//この辺が怪しい? 11app.use(express.static(__dirname + '/public')); 12 13 14 15app.get('/', function(req, res){ 16 res.sendFile(__dirname + '/index.html'); 17}); 18 19//socket.io処理は省略 20 21http.listen(3000, function(){ 22 console.log('listening on *:3000'); 23});
上記は/home/manager/www/sample/app.jsです。
xxx.xx.xxx.xxx:3000/socket.io/socket.jsはキャッシュできていますが
xxx.xx.xxx.xxx:3000/public/stylesheets/index.cssはキャッシュできていないようです。
あなたの回答
tips
プレビュー