From d84b977fddc59cc876d14962f81f5b2acbd8c7e4 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:31:07 -0430 Subject: [PATCH 01/12] Delete auth0-variables.js --- example/socketsio-auth0-sample/auth0-variables.js | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 example/socketsio-auth0-sample/auth0-variables.js diff --git a/example/socketsio-auth0-sample/auth0-variables.js b/example/socketsio-auth0-sample/auth0-variables.js deleted file mode 100644 index b55e87d..0000000 --- a/example/socketsio-auth0-sample/auth0-variables.js +++ /dev/null @@ -1,5 +0,0 @@ -(function (exports){ - exports.AUTH0_DOMAIN = 'Your_Auth0_Domain'; - exports.AUTH0_CLIENT_ID = 'Your_Auth0_Client_Id'; - exports.AUTH0_CLIENT_SECRET = 'Your_Auth0_Client_Secret'; -})(typeof exports === 'undefined' ? this['auth0Variables']={}: exports); From 18a3c01d44b501cb338dcc07aaaedebb07dbbd91 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:31:58 -0430 Subject: [PATCH 02/12] Update package.json --- example/socketsio-auth0-sample/package.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/example/socketsio-auth0-sample/package.json b/example/socketsio-auth0-sample/package.json index f4ab4e8..3a3d90e 100644 --- a/example/socketsio-auth0-sample/package.json +++ b/example/socketsio-auth0-sample/package.json @@ -3,7 +3,9 @@ "version": "0.0.1", "description": "my first socket.io app", "dependencies": { + "dotenv": "^1.2.0", "express": "^4.10.2", + "jade": "^1.11.0", "socket.io": "^1.3.6", "socketio-jwt": "^4.3.1" } From ac5c58cd6289b5c9c2ff0e38b77e00b7730aed64 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:33:06 -0430 Subject: [PATCH 03/12] Update index.js --- example/socketsio-auth0-sample/index.js | 31 ++++++++++++++++++------- 1 file changed, 22 insertions(+), 9 deletions(-) diff --git a/example/socketsio-auth0-sample/index.js b/example/socketsio-auth0-sample/index.js index a85192c..3e27d6a 100644 --- a/example/socketsio-auth0-sample/index.js +++ b/example/socketsio-auth0-sample/index.js @@ -1,20 +1,23 @@ -var app = require('express')(); +var express = require('express'); +var app=express(); var http = require('http').Server(app); var io = require('socket.io')(http); var socketioJwt = require('socketio-jwt'); -var auth0Variables = require('./auth0-variables'); +var dotenv = require('dotenv'); -app.get('/', function(req, res){ - res.sendFile(__dirname + '/index.html'); -}); +dotenv.load(); -app.get('/auth0-variables.js', function(req, res){ - res.sendFile(__dirname + '/auth0-variables.js'); -}); +var env = { + AUTH0_CLIENT_ID: process.env.AUTH0_CLIENT_ID, + AUTH0_DOMAIN: process.env.AUTH0_DOMAIN, +} + +app.set('views', __dirname + '/views') +app.set('view engine', 'jade'); io .on('connection', socketioJwt.authorize({ - secret: Buffer(auth0Variables.AUTH0_CLIENT_SECRET, 'base64'), + secret: Buffer(JSON.stringify(process.env.AUTH0_CLIENT_SECRET), 'base64'), timeout: 15000 // 15 seconds to send the authentication message })) .on('authenticated', function(socket){ @@ -24,7 +27,17 @@ io io.emit('chat message', msg); }); }); + +app.use(express.static(__dirname + '/public')); + +app.get('/', function (req, res) { + res.render('index', + { env: env } + + ) +}) http.listen(3001, function(){ console.log('listening on *:3001'); }); + From ad5aa83cee01566367b8cba33402e45e3300d31d Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:36:15 -0430 Subject: [PATCH 04/12] Create index.jade --- example/socketsio-auth0-sample/index.jade | 68 +++++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 example/socketsio-auth0-sample/index.jade diff --git a/example/socketsio-auth0-sample/index.jade b/example/socketsio-auth0-sample/index.jade new file mode 100644 index 0000000..6afedcd --- /dev/null +++ b/example/socketsio-auth0-sample/index.jade @@ -0,0 +1,68 @@ +extends layout + +block content + script(src="https://cdn.auth0.com/js/lock-7.12.js") + script(src="/socket.io/socket.io.js") + script(src="http://code.jquery.com/jquery-1.11.1.js") + + + div#login + button.btn Login + div#chat + ul#messages + form(action="") + input(id="m" autocomplete="off") + button.btn Send + + script. + var userProfile; + var userToken; + var lock = new Auth0Lock('#{env.AUTH0_CLIENT_ID}', '#{env.AUTH0_DOMAIN}'); + $('#chat').hide(); + $('#login button').click(function(e){ + e.preventDefault(); + lock.show(function(err, profile, token) { + if (err) { + //Error callback + alert('There was an error'); + alert(err); + } else { + console.log('connected and authenticated'); + //Success callback + userToken = token; + + //Save the JWT token + localStorage.setItem('userToken', token); + + //Save the profile + userProfile = profile; + + openChat(); + } + }) + }); + + function openChat(){ + var socket = io(); + socket.on('connect', function () { + socket.on('authenticated', function () { + //Do + $('#login').hide(); + $('#chat').show(); + $('form').submit(function(event){ + socket.emit('chat message', $('#m').val()); + $('#m').val(''); + return false; + }); + socket.on('chat message', function(msg){ + console.log("msg"); + $('#messages').append($('
  • ').text(msg)); + }); + }) + .emit('authenticate', {token: userToken}); // send the jwt + }) + }; + + + + From a31cc9106c8ee5d7d74f57f98e5632ff0b34ac83 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:36:55 -0430 Subject: [PATCH 05/12] Create index.jade --- .../socketsio-auth0-sample/views/index.jade | 68 +++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 example/socketsio-auth0-sample/views/index.jade diff --git a/example/socketsio-auth0-sample/views/index.jade b/example/socketsio-auth0-sample/views/index.jade new file mode 100644 index 0000000..6afedcd --- /dev/null +++ b/example/socketsio-auth0-sample/views/index.jade @@ -0,0 +1,68 @@ +extends layout + +block content + script(src="https://cdn.auth0.com/js/lock-7.12.js") + script(src="/socket.io/socket.io.js") + script(src="http://code.jquery.com/jquery-1.11.1.js") + + + div#login + button.btn Login + div#chat + ul#messages + form(action="") + input(id="m" autocomplete="off") + button.btn Send + + script. + var userProfile; + var userToken; + var lock = new Auth0Lock('#{env.AUTH0_CLIENT_ID}', '#{env.AUTH0_DOMAIN}'); + $('#chat').hide(); + $('#login button').click(function(e){ + e.preventDefault(); + lock.show(function(err, profile, token) { + if (err) { + //Error callback + alert('There was an error'); + alert(err); + } else { + console.log('connected and authenticated'); + //Success callback + userToken = token; + + //Save the JWT token + localStorage.setItem('userToken', token); + + //Save the profile + userProfile = profile; + + openChat(); + } + }) + }); + + function openChat(){ + var socket = io(); + socket.on('connect', function () { + socket.on('authenticated', function () { + //Do + $('#login').hide(); + $('#chat').show(); + $('form').submit(function(event){ + socket.emit('chat message', $('#m').val()); + $('#m').val(''); + return false; + }); + socket.on('chat message', function(msg){ + console.log("msg"); + $('#messages').append($('
  • ').text(msg)); + }); + }) + .emit('authenticate', {token: userToken}); // send the jwt + }) + }; + + + + From 8cfc9ccd6f7c17c23452021b0cb5e515f206b217 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:37:32 -0430 Subject: [PATCH 06/12] Delete index.jade --- example/socketsio-auth0-sample/index.jade | 68 ----------------------- 1 file changed, 68 deletions(-) delete mode 100644 example/socketsio-auth0-sample/index.jade diff --git a/example/socketsio-auth0-sample/index.jade b/example/socketsio-auth0-sample/index.jade deleted file mode 100644 index 6afedcd..0000000 --- a/example/socketsio-auth0-sample/index.jade +++ /dev/null @@ -1,68 +0,0 @@ -extends layout - -block content - script(src="https://cdn.auth0.com/js/lock-7.12.js") - script(src="/socket.io/socket.io.js") - script(src="http://code.jquery.com/jquery-1.11.1.js") - - - div#login - button.btn Login - div#chat - ul#messages - form(action="") - input(id="m" autocomplete="off") - button.btn Send - - script. - var userProfile; - var userToken; - var lock = new Auth0Lock('#{env.AUTH0_CLIENT_ID}', '#{env.AUTH0_DOMAIN}'); - $('#chat').hide(); - $('#login button').click(function(e){ - e.preventDefault(); - lock.show(function(err, profile, token) { - if (err) { - //Error callback - alert('There was an error'); - alert(err); - } else { - console.log('connected and authenticated'); - //Success callback - userToken = token; - - //Save the JWT token - localStorage.setItem('userToken', token); - - //Save the profile - userProfile = profile; - - openChat(); - } - }) - }); - - function openChat(){ - var socket = io(); - socket.on('connect', function () { - socket.on('authenticated', function () { - //Do - $('#login').hide(); - $('#chat').show(); - $('form').submit(function(event){ - socket.emit('chat message', $('#m').val()); - $('#m').val(''); - return false; - }); - socket.on('chat message', function(msg){ - console.log("msg"); - $('#messages').append($('
  • ').text(msg)); - }); - }) - .emit('authenticate', {token: userToken}); // send the jwt - }) - }; - - - - From e1606408ea423dc3abf786b4723bfc1baf06d8af Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:38:49 -0430 Subject: [PATCH 07/12] Create layout.jade --- example/socketsio-auth0-sample/views/layout.jade | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 example/socketsio-auth0-sample/views/layout.jade diff --git a/example/socketsio-auth0-sample/views/layout.jade b/example/socketsio-auth0-sample/views/layout.jade new file mode 100644 index 0000000..5941a37 --- /dev/null +++ b/example/socketsio-auth0-sample/views/layout.jade @@ -0,0 +1,7 @@ +doctype html +html + head + + link(rel='stylesheet', href='/stylesheets/style.css') + body + block content From ccd6172d1534e4097fffb6616c51da85b925cc5b Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:39:09 -0430 Subject: [PATCH 08/12] Delete index.html --- example/socketsio-auth0-sample/index.html | 90 ----------------------- 1 file changed, 90 deletions(-) delete mode 100644 example/socketsio-auth0-sample/index.html diff --git a/example/socketsio-auth0-sample/index.html b/example/socketsio-auth0-sample/index.html deleted file mode 100644 index 8d61c02..0000000 --- a/example/socketsio-auth0-sample/index.html +++ /dev/null @@ -1,90 +0,0 @@ - - - - Socket.IO chat - - - - - - - - - -
    - -
    -
    -
      -
      - -
      -
      - - - - - From d14e67ec27e85af51d4ed8c337cc92991b182b37 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:40:25 -0430 Subject: [PATCH 09/12] Create style.css --- .../public/stylesheets/style.css | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 example/socketsio-auth0-sample/public/stylesheets/style.css diff --git a/example/socketsio-auth0-sample/public/stylesheets/style.css b/example/socketsio-auth0-sample/public/stylesheets/style.css new file mode 100644 index 0000000..01094e7 --- /dev/null +++ b/example/socketsio-auth0-sample/public/stylesheets/style.css @@ -0,0 +1,10 @@ +{ margin: 0; padding: 0; box-sizing: border-box; } +body { font: 13px Helvetica, Arial; } +form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; } +form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; } +form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; } +#messages { list-style-type: none; margin: 0; padding: 0; } +#messages li { padding: 5px 10px; } +#messages li:nth-child(odd) { background: #eee; } +#login { width: 100%; padding: 10px } +#login button { width: 10%; padding: 8px; border: none; background: rgb(130, 255, 130);} From cda9fe25db5d9256c54146490cd8e76cd637f176 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 15:45:49 -0430 Subject: [PATCH 10/12] Update README.md --- example/socketsio-auth0-sample/README.md | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/example/socketsio-auth0-sample/README.md b/example/socketsio-auth0-sample/README.md index a8467fc..ccc146e 100644 --- a/example/socketsio-auth0-sample/README.md +++ b/example/socketsio-auth0-sample/README.md @@ -4,7 +4,16 @@ This is the seed project you need to use if you're going to create a Socket.io s ### Configure your Auth0 credentials -First, you need to put your `AUTH0_DOMAIN` (example.auth0.com), your `AUTH0_CLIENT_ID` and your `AUTH0_CLIENT_SECRET` on the `auth0-variables.js` file . You can find this information in the Application Settings on your Auth0.com dashboard. +First, you need to set the ClientSecret, ClientId and Domain for your Auth0 app as environment variables with the following names respectively: `AUTH0_CLIENT_SECRET`, `AUTH0_CLIENT_ID` and `AUTH0_DOMAIN`. You can find this information in your Auth0 Dashboard. + +So, create a file named `.env` in the directory and set the values like the following: + +````bash +# .env file +AUTH0_CLIENT_SECRET=myCoolSecret +AUTH0_CLIENT_ID=myCoolClientId +AUTH0_DOMAIN=myCoolDomain +```` ### Set up the Allowed Origin (CORS) in Auth0 From 493026cb7492be9d79554b3503a0df4d26459a49 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 16:38:16 -0430 Subject: [PATCH 11/12] Update package.json --- example/socketsio-auth0-sample/package.json | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/example/socketsio-auth0-sample/package.json b/example/socketsio-auth0-sample/package.json index 3a3d90e..f2bf0dd 100644 --- a/example/socketsio-auth0-sample/package.json +++ b/example/socketsio-auth0-sample/package.json @@ -1,7 +1,10 @@ { - "name": "socket-chat-example", - "version": "0.0.1", - "description": "my first socket.io app", + "name": "socket-Auth0-chat-example", + "version": "1.0.0", + "description": "Auth0 + Socket.io seed", + "repository": "git://github.com/auth0/socketio-jwt", + "author": "Auth0", + "license": "MIT", "dependencies": { "dotenv": "^1.2.0", "express": "^4.10.2", From 454f50187e02358038dace0194d0e79ed192afc0 Mon Sep 17 00:00:00 2001 From: Annyv2 Date: Tue, 1 Dec 2015 16:48:31 -0430 Subject: [PATCH 12/12] Update style.css --- example/socketsio-auth0-sample/public/stylesheets/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/example/socketsio-auth0-sample/public/stylesheets/style.css b/example/socketsio-auth0-sample/public/stylesheets/style.css index 01094e7..f032aee 100644 --- a/example/socketsio-auth0-sample/public/stylesheets/style.css +++ b/example/socketsio-auth0-sample/public/stylesheets/style.css @@ -1,4 +1,4 @@ -{ margin: 0; padding: 0; box-sizing: border-box; } +* { margin: 0; padding: 0; box-sizing: border-box; } body { font: 13px Helvetica, Arial; } form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; } form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }