Node.js 學習日記--番外 No.2 隱藏設定與資料( .env )

如果在看的過程中有任何錯誤歡迎寫 E-MAIL： pp840405@gmail.com 提醒我錯誤。

dotenv - 環境變數設定

這篇使用 No.1 文章的文件載點， dotenv 需要安裝這套件，但文件的 package 已經有資訊了， 到時候需要使用 .env 的環境變數這環境變數在 node.js 上已經有內建了。

  1. 在 contact.js 上面開起套件新增一個套件

    1
    2
    3
    4
    5
    6
    7
    var express = require('express');
    var router = express.Router();
    var csrf = require('csurf');
    var csrfProtection = csrf({ cookie: true });
    var nodeemailer = require('nodemailer');
    //新增 dotenv
    require('dotenv').config();

  2. 在根目錄也就是 email_init 資料夾下面新增一個 .env 檔案，沒有檔名只有副檔名，依照下面這樣寫入

    1
    2
    gmailUser = 自己的Email
    gmailPass = 自己的Email密碼

  3. 在 contact.js 修改一段成下列程式碼

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    router.post('/post', csrfProtection, function(req, res) {
        var transport = nodeemailer.createTransport({
            service:'Gmail',
            //寄件者是誰
            auth:{
                //因為這個資料是機密所以不被他人看到所以抓取.env的內容
                user: process.env.gmailUser,
                pass: process.env.gmailPass
            }
        });

  4. 像 .env 檔案並不會上傳到 github 之類的網站，這些網站都會有一個類似 env 的機制， HEROKU 就有一個機制可以保密機密資料。
    六角學院擁有

connect-flash - 資料暫存設計

如何比對使用者填寫表單資料格式是否正確，一樣 如果沒有有安裝請先安裝，這邊提供 package 檔案裡有 connect-flash 資訊了。

  1. 請先開啟 app.js 檔案並且開啟2個套件且加入一些程式碼，沒有寫上去的資料都不用去動。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    var flash = require('connect-flash');
    var session = require('express-session');
    //
    app.use(session({
      secret: 'mysuoercat',
      resave: true,
      saveUninitialized: true
    }));
    app.use(flash());

  2. 開啟 contact.js 新增，新增的內容都寫在註解下面

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    router.get('/', csrfProtection, function(req, res) {
        res.render('contact',{ 
            csrfToken: req.csrfToken() ,
            //設定一個名為 errors 的資料，下面會設定處發後你鍊帶入什麼資訊
            errors: req.flash('errors')
        });
    });
    router.get('/review', function(req, res) {
        res.render('contactReview');
    });
    router.post('/post', csrfProtection, function(req, res) {
        //下判斷
        if(req.body.username == ''){
            //如果 username 欄位空值那就會跑出一個 errors 的變數並帶入資料
            req.flash('errors','姓名不能為空');
            //之後並轉址到 /contact
            return  res.redirect('/contact');
        };
        var transport = nodeemailer.createTransport({
            service:'Gmail',
            auth:{
                user:process.env.gmailUser,
                pass:process.env.gmailPass
            }
        });
        var mailoptions = {
            form:'"我是帥哥"<liuconing@gmail.com>',
            to : 'pp840405@gmail.com',
            subject: req.body.username + '寄了一封信',
            text: req.body.description
        };
        transport.sendMail(mailoptions,function(error,info){
            if(error){
                return console.log(error);
            }
            res.redirect('review');
        });
    });

  3. 判斷有下好之後網頁並不會顯示 errors 裡面得資料，所以也要到 contact.ejs 去新增。

    1
    2
    3
    4
    5
    6
    <h1>聯絡我們</h1>
            <%= errors %>
            <div>
                <label for="username">姓　　名：</label>
                <input type="text" name="username" id="username"/>
            </div>

這套件是建立一個暫存資料的區域，只會占用極小部分記憶體一旦網頁再度重新整理這段資料就會消失，除非在觸發它的程式才會再度啟動。

結語

基本上 node.js 的一些基礎就到這邊，如果有學到其他東西我會視情況在這分享，有任何問題歡迎寫 MAIL： pp840405@gmail.com 一起共同討論。