###前提・実現したいこと
node.jsを使い、socket.ioを使ったサイトを作ろうとしています。
expressを使って動的URLも組み込みたいです。
###発生している問題・エラーメッセージ
app.jsを起動しようとすると、ターミナルに下記のエラーが吐き出されてしまい、socket接続が上手くいきません。
warn - error raised: Error: listen EACCES 0.0.0.0:80
###該当のソースコード
javascript
1var http = require('http'); 2var path = require('path'); 3var async = require('async'); 4var socketio = require('socket.io'); 5var io = socketio.listen( server ); 6var express = require('express'), 7 app = express(); 8 9var router = express(); 10var server = http.createServer(router); 11 12app.listen(process.env.PORT || 3000, process.env.IP || "0.0.0.0", function(){ 13 var addr = server.address(); 14}); 15 16 17app.use(express.json()); 18app.use(express.urlencoded()); 19app.use(express.logger('dev')); 20app.use(function(req,res,next){ 21 next(); 22}); 23 24app.set('views', __dirname + '/client'); 25app.set('view engine', 'ejs'); 26 27 app.get('/', function(req, res) { 28 res.render('index'); 29}); 30 31io.sockets.on('connection', (socket) => { 32 console.log('a user connected'); 33});
html
1<!DOCTYPE HTML> 2<html lang="ja"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <script src="/socket.io/socket.io.js"></script> 7 <script> 8 var socket = io(); 9 </script> 10 </head> 11</html> 12
###試したこと
expressを使って動的URL
expressとsocket.ioの両方を使っているcloud9のsocket.ioサンプルコードを流用して書き換えようとしたところ、socket通信には成功したものの、動的URLを上手く扱えませんでした。
cloud9のnode.jsサンプル
javascript
1// 2// # SimpleServer 3// 4// A simple chat server using Socket.IO, Express, and Async. 5// 6var http = require('http'); 7var path = require('path'); 8 9var async = require('async'); 10var socketio = require('socket.io'); 11var express = require('express'), 12 app=express(); 13 14// 15// ## SimpleServer `SimpleServer(obj)` 16// 17// Creates a new instance of SimpleServer with the following options: 18// * `port` - The HTTP port to listen on. If `process.env.PORT` is set, _it overrides this value_. 19// 20var router = express(); 21var server = http.createServer(router); 22var io = socketio.listen(server); 23 24router.use(express.static(path.resolve(__dirname, 'client'))); 25var messages = []; 26var sockets = []; 27 28io.on('connection', function (socket) { 29 messages.forEach(function (data) { 30 socket.emit('message', data); 31 }); 32 33 sockets.push(socket); 34 35 socket.on('disconnect', function () { 36 sockets.splice(sockets.indexOf(socket), 1); 37 updateRoster(); 38 }); 39 40 socket.on('message', function (msg) { 41 var text = String(msg || ''); 42 43 if (!text) 44 return; 45 46 socket.get('name', function (err, name) { 47 var data = { 48 name: name, 49 text: text 50 }; 51 52 broadcast('message', data); 53 messages.push(data); 54 }); 55 }); 56 57 socket.on('identify', function (name) { 58 socket.set('name', String(name || 'Anonymous'), function (err) { 59 updateRoster(); 60 }); 61 }); 62 }); 63 64function updateRoster() { 65 async.map( 66 sockets, 67 function (socket, callback) { 68 socket.get('name', callback); 69 }, 70 function (err, names) { 71 broadcast('roster', names); 72 } 73 ); 74} 75 76function broadcast(event, data) { 77 sockets.forEach(function (socket) { 78 socket.emit(event, data); 79 }); 80} 81 82 83server.listen(process.env.PORT || 3000, process.env.IP || "0.0.0.0", function(){ 84 var addr = server.address(); 85 console.log("Chat server listening at", addr.address + ":" + addr.port); 86}); 87
html
1<!doctype html> 2<html lang="en" ng-app> 3 <head> 4 <title>Chat Example</title> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <link rel="stylesheet" href="/css/bootstrap.min.css"> 7 <link rel="stylesheet" href="/css/bootstrap-responsive.min.css"> 8 <style> 9 body { 10 padding-top: 60px; 11 } 12 </style> 13 <script> 14 function ChatController($scope) { 15 var socket = io.connect(); 16 17 $scope.messages = []; 18 $scope.roster = []; 19 $scope.name = ''; 20 $scope.text = ''; 21 22 socket.on('connect', function () { 23 $scope.setName(); 24 }); 25 26 socket.on('message', function (msg) { 27 $scope.messages.push(msg); 28 $scope.$apply(); 29 }); 30 31 socket.on('roster', function (names) { 32 $scope.roster = names; 33 $scope.$apply(); 34 }); 35 36 $scope.send = function send() { 37 console.log('Sending message:', $scope.text); 38 socket.emit('message', $scope.text); 39 $scope.text = ''; 40 }; 41 42 $scope.setName = function setName() { 43 socket.emit('identify', $scope.name); 44 }; 45 } 46 </script> 47 </head> 48 <body> 49 <div class="container" ng-controller="ChatController"> 50 <div class="navbar navbar-fixed-top navbar-inverse"> 51 <div class="navbar-inner"> 52 <div class="pull-right"> 53 <a href="https://c9.io" class="brand">Cloud9 IDE</a> 54 </div> 55 </div> 56 </div> 57 <div class="page-header"> 58 <h1>Chat Example</h1> 59 </div> 60 <div class="row"> 61 <div class="span3"> 62 <ul class="nav nav-list well"> 63 <li class="nav-header">Local Users</li> 64 <li ng-repeat="user in roster" ng-bind="user"> 65 </li> 66 </ul> 67 </div> 68 <div class="span9"> 69 <table class="table table-striped table-bordered"> 70 <thead> 71 <tr> 72 <th class="span2">Name</th> 73 <th class="span7">Text</th> 74 </tr> 75 </thead> 76 <tbody> 77 <tr ng-repeat="msg in messages"> 78 <td class="span2" ng-bind="msg.name"></td> 79 <td class="span7" ng-bind="msg.text"></td> 80 </tr> 81 </tbody> 82 </table> 83 <div class="row controls"> 84 <form ng-submit="send()"> 85 <div class="span2"><input type="text" class="input-block-level" ng-model="name" ng-change="setName()" placeholder="Your Name"></div> 86 <div class="input-append span7"> 87 <input type="text" class="span6" ng-model="text" placeholder="Message"> 88 <input type="submit" class="span1 btn btn-primary" value="Send" ng-disabled="!text"> 89 </div> 90 </form> 91 </div> 92 </div> 93 </div> 94 </div> 95 <script src="/socket.io/socket.io.js"></script> 96 <script src="/js/jquery.min.js"></script> 97 <script src="/js/bootstrap.min.js"></script> 98 <script src="/js/angular.min.js"></script> 99 </body> 100</html>
逆に、cloud9のサンプルコードのindex.htmlをそのまま持ってきたところ、表示はできたもののsocket接続ができませんでした。
###補足情報(言語/FW/ツール等のバージョンなど)
node.js v6.11.2
express 3.2.6
socket.io 0.9.19
開発環境はcloud9です。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/09/20 06:12