{"id":3408,"date":"2020-03-31T09:00:49","date_gmt":"2020-03-31T00:00:49","guid":{"rendered":"https:\/\/www.sambuichi.jp\/?p=3408"},"modified":"2020-03-31T13:14:19","modified_gmt":"2020-03-31T04:14:19","slug":"javascript%e3%82%af%e3%83%a9%e3%82%a4%e3%82%a2%e3%83%b3%e3%83%88%e3%82%92socket-io%e3%81%a7","status":"publish","type":"post","link":"https:\/\/www.sambuichi.jp\/?p=3408","title":{"rendered":"socket.io\u3067Javascript\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u958b\u767a"},"content":{"rendered":"

Views: 74<\/p>\n

\n
\u76ee\u6b21<\/div>\n

\n \u6982\u8981<\/a>
\n Nginx\u306econf\u30d1\u30e9\u30e1\u30bf\u8a2d\u5b9a<\/a>
\n \u30d7\u30ed\u30b0\u30e9\u30e0\u4fee\u6b63<\/a>\n<\/p>\n<\/div>\n

<\/span><\/p>\n

\u6982\u8981<\/h4>\n

\nAmazon EC2\u30b5\u30fc\u30d0\u30fc\u306eNginx\u3092Node.js(Express)\u3078\u306e\u30d7\u30ed\u30ad\u30b7\u30fc\u3068\u3057\u3066\u8a2d\u5b9a\u3057\u3066GitHub\u306esocketio\/socket.io\u306b\u3042\u308bchat\u306e\u30b5\u30f3\u30d7\u30eb\u30d7\u30ed\u30b0\u30e9\u30e9\u30e0\u3092\u518d\u73fe\u3059\u308b\u3002\u30b5\u30a4\u30c8\u306eHow to use\u306b\u306f\u3001\u6b21\u306e\u8a18\u8ff0\u304c\u3042\u308b\u304c\u3001\u74b0\u5883\u8a2d\u5b9a\u3068\u30d7\u30ed\u30b0\u30e9\u30e0\u3092\u4e00\u90e8\u4fee\u6b63\u3057\u305f\u3002\n<\/p>\n

$ cd socket.io\r\n$ npm install\r\n$ cd examples\/chat\r\n$ npm install\r\n$ npm start<\/pre>\n
<\/i>And point your browser to http:\/\/localhost:3000. Optionally, specify a port by supplying the PORT env variable.<\/i><\/p>\n
http:\/\/localhost:3000\u3067\u306f\u306a\u304fEC2\u30db\u30b9\u30c8\u3092\u6307\u5b9a\u3059\u308b\u305f\u3081\u306b\u4ee5\u964d\u306e\u5909\u66f4\u3092\u884c\u3063\u305f\u3002<\/p>\n
<\/span><\/p>\n
Nginx\u306econf\u30d1\u30e9\u30e1\u30bf\u8a2d\u5b9a<\/h4>\n
NGINX\u3092WebSocket Proxy\u306b\u4f7f\u3046\uff08Amazon EC2\uff09<\/a>\u3067\u7d39\u4ecb\u3057\u305f\u8a2d\u5b9a\u306b\u9759\u7684\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u63d0\u4f9b\u3059\u308b\u305f\u3081\u306elocation ~ ^\/chat\/(.*)$\u3092\u8ffd\u52a0\u3059\u308b\u3002\u30b5\u30f3\u30d7\u30eb\u306echat\/public\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306e\u4e0b\u306e\u30d5\u30a1\u30a4\u30eb\u306f\u3001\/your\/web\/example\/chat\/\u306e\u4e0b\u306b\u914d\u7f6e\u3057\u305f\u3002<\/p>\n
map $http_upgrade $connection_upgrade {\r\n    default upgrade;\r\n    '' close;\r\n}\r\n\r\nupstream websocket {\r\n    server 127.0.0.1:3000;\r\n}\r\n   \r\nserver {\r\n    server_name example.host.com;\r\n\r\n    \u7565\r\n\r\n    location ~ ^\/chat\/(.*)$ {\r\n        alias \/your\/web\/example\/chat\/$1;\r\n    }\r\n\r\n    location \/ {\r\n        proxy_pass http:\/\/websocket;\r\n        proxy_http_version 1.1;\r\n        proxy_set_header Upgrade $http_upgrade;\r\n        proxy_set_header Connection $connection_upgrade;\r\n        proxy_set_header Host $host;\r\n    }\r\n}<\/pre>\n
<\/span><\/p>\n
GitHub\u30d7\u30ed\u30b0\u30e9\u30e0\u4fee\u6b63<\/h4>\n
chat\u30d7\u30ed\u30b0\u30e9\u30e0\u3092\u5b9f\u884c\u3059\u308b\u305f\u3081\u306b\u3001\u5909\u66f4\u3057\u305f\u306e\u306f\u6b21\u306e\u7b87\u6240\u3002socket.io\u30e9\u30a4\u30d6\u30e9\u30ea\u3092package.json\u306b\u8ffd\u52a0\u3002<\/p>\n
var server = require('http').Server(app);\r\nvar io = require('socket.io')(server);<\/pre>\n
{\r\n  \"name\": \"socket.io-chat\",\r\n  \"version\": \"0.0.0\",\r\n  \"description\": \"A simple chat client using socket.io\",\r\n  \"main\": \"index.js\",\r\n  \"author\": \"Grant Timmerman\",\r\n  \"private\": true,\r\n  \"license\": \"BSD\",\r\n  \"dependencies\": {\r\n    \"express\": \"4.13.4\",\r\n    \"socket.io\": \"^1.7.3\"\r\n  },\r\n  \"scripts\": {\r\n    \"start\": \"node index.js\"\r\n  }\r\n}<\/pre>\n
\u307e\u305f\u3001index.html\u306esocket.io\u3078\u306e\u30d1\u30b9\u3092\u5909\u66f4\u3057\u3066\u6b21\u306e\u3088\u3046\u306b\u3057\u305f\u3002<\/p>\n
<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/socket.io-client@2\/dist\/socket.io.js\"><\/script>\r\n<script src=\"main.js\"><\/script><\/pre>\n
\u3053\u306e\u5f8c<\/p>\n
$ npm install\r\n$ npm start<\/pre>\n
\u30b5\u30fc\u30d0\u30fc\u30d7\u30ed\u30b0\u30e9\u30e0\u306f\u3001Node\u30b5\u30fc\u30d0\u30fc\u30d7\u30ed\u30b0\u30e9\u30e0\u306e\u958b\u767a<\/a>\u306b\u5f93\u3063\u305f\u624b\u9806\u3067\u52d5\u4f5c\u78ba\u8a8d\u3057\u305f\u3002
\n\"\"<\/a><\/p>\n
\u53c2\u8003\uff1ahttps:\/\/socket.io\/get-started\/chat\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Views: 74 \u76ee\u6b21 \u6982\u8981 Nginx\u306econf\u30d1\u30e9\u30e1\u30bf\u8a2d\u5b9a \u30d7\u30ed\u30b0\u30e9\u30e0\u4fee\u6b63 \u6982\u8981 Amazon EC2\u30b5\u30fc\u30d0\u30fc\u306eNginx\u3092Node.js(Express)\u3078\u306e\u30d7\u30ed\u30ad\u30b7\u30fc\u3068\u3057\u3066\u8a2d\u5b9a\u3057\u3066GitHub\u306esocketio […]<\/p>\n","protected":false},"author":2,"featured_media":3425,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[20],"tags":[],"_links":{"self":[{"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/posts\/3408"}],"collection":[{"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3408"}],"version-history":[{"count":31,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/posts\/3408\/revisions"}],"predecessor-version":[{"id":3443,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/posts\/3408\/revisions\/3443"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=\/wp\/v2\/media\/3425"}],"wp:attachment":[{"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3408"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3408"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sambuichi.jp\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3408"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}