Last active
August 29, 2015 14:02
-
-
Save drorm/e69cfc8ac267fefb04cf to your computer and use it in GitHub Desktop.
Node http-proxy websockets
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<script src="/socket.io/socket.io.js"></script> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> | |
</head> | |
<body> | |
<script> | |
var URL = window.location.protocol + "//" + window.location.host; | |
console.log("Connecting to " + URL); | |
var socket = io.connect(URL); | |
// on connection to server, ask for user's name with an anonymous callback | |
socket.on('connect', function(){ | |
// call the server-side function 'adduser' and send one parameter (value of prompt) | |
socket.emit('adduser', prompt("What's your name?")); | |
}); | |
// listener, whenever the server emits 'updatechat', this updates the chat body | |
socket.on('updatechat', function (username, data) { | |
$('#conversation').append('<b>'+username + ':</b> ' + data + '<br>'); | |
}); | |
// listener, whenever the server emits 'updateusers', this updates the username list | |
socket.on('updateusers', function(data) { | |
$('#users').empty(); | |
$.each(data, function(key, value) { | |
$('#users').append('<div>' + key + '</div>'); | |
}); | |
}); | |
// on load of page | |
$(function(){ | |
// when the client clicks SEND | |
$('#datasend').click( function() { | |
var message = $('#data').val(); | |
$('#data').val(''); | |
// tell server to execute 'sendchat' and send along one parameter | |
socket.emit('sendchat', message); | |
}); | |
// when the client hits ENTER on their keyboard | |
$('#data').keypress(function(e) { | |
if(e.which == 13) { | |
$(this).blur(); | |
$('#datasend').focus().click(); | |
} | |
}); | |
}); | |
</script> | |
<div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;"> | |
<b>USERS</b> | |
<div id="users"></div> | |
</div> | |
<div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;"> | |
<div id="conversation"></div> | |
<input id="data" style="width:200px;" /> | |
<input type="button" id="datasend" value="send" /> | |
</div> | |
</body> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "node-chat", | |
"version": "0.0.1", | |
"dependencies": { | |
"express": "^4.4.1", | |
"socket.io": "latest" | |
}, | |
"engines": { | |
"node": "0.8.x", | |
"npm": "1.1.x" | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Chat from http://michieldemey.be/blog/node-js-and-socket-io-a-basic-chat-application-using-websockets/ | |
var http = require('http'), | |
httpProxy = require('http-proxy'), | |
express = require('express'); | |
// create a server | |
var app = express(); | |
var proxy = httpProxy.createProxyServer({ ws: true }); | |
// proxy HTTP GET / POST | |
app.get('/socket.io/*', function(req, res) { | |
console.log("proxying GET request", req.url); | |
proxy.web(req, res, { target: 'http://localhost:8081'}); | |
}); | |
app.post('/socket.io/*', function(req, res) { | |
console.log("proxying POST request", req.url); | |
proxy.web(req, res, { target: 'http://localhost:8081'}); | |
}); | |
// Proxy websockets | |
app.on('upgrade', function (req, socket, head) { | |
console.log("proxying upgrade request", req.url); | |
proxy.ws(req, socket, head); | |
}); | |
// serve static content | |
app.use('/', express.static(__dirname + "/public")); | |
app.listen(8080); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var port = 5000; | |
var app = require('express')(); | |
var server = require('http').createServer(app); | |
var io = require('socket.io').listen(server); | |
console.log("Listening on port " + port); | |
server.listen(port); | |
// routing | |
app.get('/', function (req, res) { | |
res.sendfile(__dirname + '/chat.html'); | |
}); | |
// usernames which are currently connected to the chat | |
var usernames = {}; | |
io.sockets.on('connection', function (socket) { | |
// when the client emits 'sendchat', this listens and executes | |
socket.on('sendchat', function (data) { | |
// we tell the client to execute 'updatechat' with 2 parameters | |
io.sockets.emit('updatechat', socket.username, data); | |
}); | |
// when the client emits 'adduser', this listens and executes | |
socket.on('adduser', function(username){ | |
// we store the username in the socket session for this client | |
socket.username = username; | |
// add the client's username to the global list | |
usernames[username] = username; | |
// echo to client they've connected | |
socket.emit('updatechat', 'SERVER', 'you have connected'); | |
// echo globally (all clients) that a person has connected | |
socket.broadcast.emit('updatechat', 'SERVER', username + ' has connected'); | |
// update the list of users in chat, client-side | |
io.sockets.emit('updateusers', usernames); | |
}); | |
// when the user disconnects.. perform this | |
socket.on('disconnect', function(){ | |
// remove the username from global usernames list | |
delete usernames[socket.username]; | |
// update list of users in chat, client-side | |
io.sockets.emit('updateusers', usernames); | |
// echo globally that this client has left | |
socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected'); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment