好的, 這一篇是接著stenio123老大的第二章節, 也就是 part 2 – Sails js Socket.io intermediate – rooms and streams

這一篇的練習做完, 大致上就可以掌握sails socket.io的百分之七十的用法了

我們先把程式碼寫一寫

這個程式碼是接續自上一篇, 我們繼續在socket_test的專案下執行

OK, 由於Irl先生接下來會用到socket.io, 整合到activityOverlord專案中

因為Irl先生是用舊版的Sails, 也就是Sails 0.9的, 而在Sails 0.11之後, sails對於socket.io的支援改動滿大的

所以我就上網找了一些相容於sails 0.11的專案來練習

先講幾個用法上的觀念

1. Sails已經將socket.io整合進自己的架構, 你可以在assets\js\dependencies\找到sails.io.js這個檔案, 這個檔案就是socket.io的精隨了
2. Sails將socket.io的使用整合進它自己的MVC架構, 也就是說, 我們在操控socket.io這些方法的時候, 大部分是在Controller這邊處理, 我們會在後面的例子中談到
3. Sails針對socket.io的用法有提供socket.io模式的Method,也有提供Sails本身Data Module的Method, 看你要用哪一種

好的, 這篇我要來好好的念一下NPM, 也就是 package manager for node.js

這真的太令我生氣啦!!!

如果你是用WIN7… 對! 就是WIN7, 你可能會遇到底下我遇到的問題

當你去了官網 nodejs.org 下載Windows的安裝包, 安裝完成之後, 通常npm都會一起被安裝進去了

這個時候你開啟cmd, 輸入node或者npm, 應該都已經可以執行

影片是: Understanding websockets and socket.io

Irl介紹了一下Socket.io, 並且寫了一個範例程式, 內容滿精彩的, 非常值得看的一篇教學

在範例的程式碼當中, 分成Server Side以及Client Side的網頁

Server Side是用node.js寫一個小型的http server,然後掛上socket.io的module,用來處理前端的要求

Client Side則是一個簡單的index.html,掛上JQuery的Javascript以及Socket.io的Javascript

socket.io很適合用來做聊天程式,Irl示範了如何開啟兩個(或以上)的獨立聊天室並且講解觀念

他的範例有一些小bug, 修改一下就可以run了, 首先我們從Server Side開始

在之前的章節, Ira展示了如何區分管理者和一般使用者. 然而有些網友, 指出了一些漏洞, 讓我們可以直接修改前端程式碼, 就可以獲得管理者的權限.

影片在這邊: Building a Sails Application: Ep17a - Marshalling request parameters

好的, 主要的概念是這樣, 開啟瀏覽器, 使用一般使用者登入, 進入修改頁面(Edit), 然後用firefox的firebug開啟除錯模式, 將admin的checkbox加進去html裡面, 並且將checkbox勾選起來, 最後按下proceed!

你就會發現, 一般使用者突然間就會變成管理員嚕! 超High的!

本篇的Video在Building a Sails Application: Ep17 - Creating a distinction between admin and regular users.

這一章我在實作的時候遇到了很多問題, 尤其是前端使用者的Edit頁面, 將Admin打勾傳送到後端, 卻發生admin始終都是false的狀況.

看了網路上不少文章, 我把我自己的解法以及網路上的解法還有參考網站都列在本篇文章中

OK, 讓我們開始.

在activeityOverload\api\models\User.js新增admin的attribute

本章主要是調整登入的外觀

課程連結是 Building a Sails Application: Ep15 - Improving user authenticated navigation.

主要是修改activeityOverload\views\layout.ejs

在原本<%- body %>的上方, 有個簡單的頭導航介面, 把它換成如下的程式碼

在更新node.js以及npm之後 (npm現在被包在node.js裡面一起安裝)

我執行npm -g update, global有更新的node.js的module都update到最新的

接著我切換到我這一陣子再用的sails的專案, 執行sails lift的時候

發生了Cannot find module 'lru-cache' 這個事件

本章的Video為 Ep14 - User authentication and restricting access through policies.

首先,我們要先將前一章的Session的練習的程式碼先拿掉,

接著修改SessionController.js, 新增create action

本篇進展到這邊, 主要是提到Session的使用, 影片是Building a Sails Application: Ep13 - Sign-in page, session controller, new action, and sessions.

首先, 在views/新增一個目錄名叫session, 在session裡面新增一個ejs檔案名為new.ejs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<form action="/session/create" method="POST" class="form-signin">
  <h2 class="form-signin-heading">Please sign in...</h2>

  <% if(flash && flash.err) { %>
      <ul class="alert alert-success">
  <% Object.keys(flash.err).forEach(function(error) { %>
      <li><%- JSON.stringify(flash.err[error]) %></li>
  <% }) %>
  </ul>
  <% } %>

  <input type="text" class="form-control" placeholder="Email address" name="email">
  <input type="password" class="form-control" placeholder="Password" name="password">
  <input type="submit" class="btn btn-lg btn-primary btn-block" value="Sign-in"/>
  <input type="hidden" name="_csrf" value="<%= _csrf %>" />
  
</form>