from Github is done in your account profile settings under 'developer settings', then 'OAuth applications'. Click 'Register a new application', name your app, paste in the url to your gomix homepage (Not the project code's url), and lastly for the callback url, paste in the same url as the homepage but with '/auth/github/callback' added on. This is where users will be redirected to for us to handle after authenticating on Github. Save the returned information as 'GITHUB_CLIENT_ID' and 'GITHUB_CLIENT_SECRET' in your .env file.",
@@ -458,6 +472,7 @@
"id": "589a69f5f9fc0f352b528e71",
"title": "Implementation of Social Authentication II",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"The last part of setting up your Github authentication is to create the strategy itself. For this, you will need to add the dependency of 'passport-github' to your project and require it as GithubStrategy like const GitHubStrategy = require('passport-github').Strategy;.",
"To set up the Github strategy, you have to tell passport to use an instantiated GithubStrategy, which accepts 2 arguments: An object (containing clientID, clientSecret, and callbackURL) and a function to be called when a user is successfully authenticated which we will determine if the user is new and what fields to save initially in the user's database object. This is common across many strategies but some may require more information as outlined in that specific strategy's github README; for example, Google requires a scope as well which determines what kind of information your request is asking returned and asks the user to approve such access. The current strategy we are implementing has its usage outlined here, but we're going through it all right here on freeCodeCamp!",
"Here's how your new strategy should look at this point: passport.use(new GitHubStrategy({\n clientID: process.env.GITHUB_CLIENT_ID,\n clientSecret: process.env.GITHUB_CLIENT_SECRET,\n callbackURL: /*INSERT CALLBACK URL ENTERED INTO GITHUB HERE*/\n },\n function(accessToken, refreshToken, profile, cb) {\n console.log(profile);\n //Database logic here with callback containing our user object\n }\n));",
@@ -489,6 +504,7 @@
"id": "589a8eb3f9fc0f352b528e72",
"title": "Implementation of Social Authentication III",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"The final part of the strategy is handling the profile returned from Github. We need to load the users database object if it exists or create one if it doesn't and populate the fields from the profile, then return the user's object. Github supplies us a unique id within each profile which we can use to search with to serialize the user with (already implemented). Below is an example implementation you can use in your project- it goes within the function that is the second argument for the new strategy, right below the console.log(profile); currently is:",
"db.collection('socialusers').findAndModify(\n {id: profile.id},\n {},\n {$setOnInsert:{\n id: profile.id,\n name: profile.displayName || 'John Doe',\n photo: profile.photos[0].value || '',\n email: profile.emails[0].value || 'No public email',\n created_on: new Date(),\n provider: profile.provider || ''\n },$set:{\n last_login: new Date()\n },$inc:{\n login_count: 1\n }},\n {upsert:true, new: true},\n (err, doc) => {\n return cb(null, doc.value);\n }\n);",
"With a findAndModify, it allows you to search for an object and update it, as well as upsert the object if it doesn't exist and receive the new object back each time in our callback function. In this example, we always set the last_login as now, we always increment the login_count by 1, and only when we insert a new object(new user) do we populate the majority of the fields. Something to notice also is the use of default values. Sometimes a profile returned won't have all the information filled out or it will have been chosen by the user to remain private; so in this case we have to handle it to prevent an error.",
@@ -514,8 +530,8 @@
[
"",
"",
- "Socket.IO enables real-time, reliable, speedy communication between your server and clients from all devices and browsers. It listens for connects on your server that come from the client which connects with a single javascript statement. The whole library is based on emitting, broadcasting, and recieving events that contain an event name and some data which can include things like strings, objects, arrays, and even blobs like files or video. This is used for all sorts of purposes including instant messaging online, real-time analytics, streaming, and document collaboration.
Minimal changes need to be made with your recent project to set it up to create a chat room for authenticated Github users- Open the starter project below and hit Remix it to create your own private version to get started!",
- "https://gomix.com/#!/project/fcc-socket"
+ "Socket.IO enables real-time, reliable, speedy communication between your server and clients from all devices and browsers. It listens for connects on your server that come from the client which connects with a single javascript statement. The whole library is based on emitting, broadcasting, and recieving events that contain an event name and some data which can include things like strings, objects, arrays, and even blobs like files or video. This is used for all sorts of purposes including instant messaging online, real-time analytics, streaming, and document collaboration.
Start this project on Gomix using this link or clone this repository on GitHub! If you use Gomix, remember to save the link to your project somewhere safe.",
+ ""
],
[
"",
@@ -553,6 +569,7 @@
"id": "589fc830f9fc0f352b528e74",
"title": "Setting up the Enviroment",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Add Socket.IO as a dependency and require/instanciate it in your server defined as 'io' with the http server as an argument. const io = require('socket.io')(http);",
"The first thing needing to be handled is listening for a new connection from the client. The on keyword does just that- listen for a specific event. It requires 2 arguments: a string containing the title of the event thats emitted, and a function with which the data is passed though. In the case of our connection listener, we use socket to define the data in the second argument. A socket is an individual client who is connected.",
"For listening for connections on our server, add the following between the comments in your project:io.on('connection', socket => {\n console.log('A user has connected');\n});",
@@ -590,6 +607,7 @@
"id": "589fc831f9fc0f352b528e75",
"title": "Communicating by Emitting",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Emit is the most common way of communicating you will use. When you emit something from the server to 'io', you send an event's name and data to all the connected sockets. A good example of this concept would be emiting the current count of connected users each time a new user connects!",
"
Start by adding a variable to keep track of the users just before where you are currently listening for connections. var currentUsers = 0;",
"Now when someone connects you should increment the count before emiting the count so you will want to add the incrementer within the connection listener. ++currentUsers;",
@@ -623,6 +641,7 @@
"id": "589fc831f9fc0f352b528e76",
"title": "Handling a disconnect",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"You may notice that up to now you have only been increasing the user count. Handling a user disconnecting is just as easy as handling the initial connect except the difference is you have to listen for it on each socket versus on the whole server.",
"
To do this, add in to your existing connect listener a listener that listens for 'disconnect' on the socket with no data passed through. You can test this functionality by just logging to the console a user has disconnected. socket.on('disconnect', () => { /*anything you want to do on disconnect*/ });",
"To make sure clients continuously have the updated count of current users, you should decrease the currentUsers by 1 when the disconnect happens then emit the 'user count' event with the updated count!",
@@ -650,6 +669,7 @@
"id": "589fc831f9fc0f352b528e77",
"title": "Authentication with Socket.IO",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Currently, you cannot determine who is connected to your web socket. While 'req.user' containers the user object, thats only when your user interacts with the web server and with web sockets you have no req (request) and therefor no user data. One way to solve the problem of knowing who is connected to your web socket is by parsing and decoding the cookie that contains the passport session then deserializing it to obtain the user object. Luckily, there is a package on NPM just for this that turns a once complex task into something simple!",
"
Add 'passport.socketio' as a dependency and require it as 'passportSocketIo'.",
"Now we just have to tell Socket.IO to use it and set the options. Be sure this is added before the existing socket code and not in the existing connection listener. For your server it should look as follows:io.use(passportSocketIo.authorize({\n cookieParser: cookieParser,\n key: 'express.sid',\n secret: process.env.SESSION_SECRET,\n store: sessionStore\n}));You can also optionally pass 'success' and 'fail' with a function that will be called after the authentication process completes when a client trys to connect.",
@@ -681,6 +701,7 @@
"id": "589fc832f9fc0f352b528e78",
"title": "Announcing New Users",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Many chat rooms are able to annouce when a user connects or disconnects and then display that to all of the connected users in the chat. Seeing as though you already are emitting an event on connect and disconnect, you will just have to modify this event to support such feature. The most logical way of doing so is sending 3 pieces of data with the event: name of the user connected/disconnected, the current user count, and if that name connected or disconnected.",
"
Change the event name to 'user' and as the data pass an object along containing fields 'name', 'currentUsers', and boolean 'connected' (to be true if connection, or false for disconnection of the user sent). Be sure to make the change to both points we had the 'user count' event and set the disconnect one to sent false for field 'connected' instead of true like the event emitted on connect. io.emit('user', {name: socket.request.user.name, currentUsers, connected: true});",
"Now your client will have all the nesesary information to correctly display the current user count and annouce when a user connects or disconnects! To handle this event on the client side we should listen for 'user' and then update the current user count by using jQuery to change the text of #num-users to '{NUMBER} users online', as well as append a <li> to the unordered list with id 'messages' with '{NAME} has {joined/left} the chat.'.",
@@ -708,6 +729,7 @@
"id": "589fc832f9fc0f352b528e79",
"title": "Sending and Displaying Chat Messages",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"It's time you start allowing clients to send a chat message to the server to emit to all the clients! Already in your client.js file you should see there is already a block of code handling when the messgae form is submitted! ($('form').submit(function(){ /*logic*/ });)",
"
Within the code you're handling the form submit you should emit an event after you define 'messageToSend' but before you clear the text box #m. The event should be named 'chat message' and the data should just be 'messageToSend'. socket.emit('chat message', messageToSend);",
"Now on your server you should be listening to the socket for the event 'chat message' with the data being named 'message'. Once the event is recieved it should then emit the event 'chat message' to all sockets io.emit with the data being an object containing 'name' and 'message'.",
diff --git a/seed/challenges/06-information-security-and-quality-assurance/information-security-with-helmetjs.json b/seed/challenges/06-information-security-and-quality-assurance/information-security-with-helmetjs.json
index 47dc81847d..df86e99a65 100644
--- a/seed/challenges/06-information-security-and-quality-assurance/information-security-with-helmetjs.json
+++ b/seed/challenges/06-information-security-and-quality-assurance/information-security-with-helmetjs.json
@@ -4,10 +4,30 @@
"time": "5 hours",
"helpRoom": "HelpBackend",
"challenges": [
+ {
+ "id": "58af07504bbe015e85a91dbd",
+ "title": "Information Security Introduction",
+ "description": [
+ [
+ "",
+ "",
+ "Working on these challenges will involve you writing your code on Gomix on our starter project. After completing each challenge you can copy your public gomix url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicaly visible for our testing.
Start this project on Gomix using this link or clone this repository on GitHub! If you use Gomix, remember to save the link to your project somewhere safe!",
+ ""
+ ]
+ ],
+ "releasedOn": "Feb 17, 2017",
+ "challengeSeed": [],
+ "tests": [],
+ "type": "waypoint",
+ "challengeType": 7,
+ "isRequired": false,
+ "translations": {}
+ },
{
"id": "587d8247367417b2b2512c36",
"title": "Install and Require Helmet.js",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Helmet helps you secure your Express apps by setting various HTTP headers. Install the package, then require it."
],
"challengeSeed": [],
@@ -28,6 +48,7 @@
"id": "587d8247367417b2b2512c37",
"title": "Hide potentially dangerous information using helmet.hidePoweredBy()",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Hackers can exploit known vulnerabilities in Express/Node if they see that your site is powered by Express. X-Powered-By: Express is sent in every request coming from Express by default. The helmet.hidePoweredBy() middleware will remove the X-Powered-By header. You can also explicitly set the header to something else, to throw people off. e.g. app.use(helmet.hidePoweredBy({ setTo: 'PHP 4.2.0' }))"
],
"challengeSeed": [],
@@ -48,6 +69,7 @@
"id": "587d8247367417b2b2512c38",
"title": "Mitigate the risk of clickjacking - helmet.frameguard()",
"description": [
+ "As a reminder, this project is being built upon the following starter project on Gomix, or cloned from GitHub.",
"Your page could be put in a or