nodejs個人網站搭建經驗分享——路由規則設計（1）

標籤：

寒假在某公司實習，做nodejs平台下的web開發。初次學習nodejs的我感覺這個小東西真的是潛力無窮。用nodejs來做伺服器端的平台，代碼量很少，卻又有強大多樣的模組支援。於是我打算用業餘時間搭建一個個人網站。此連載文章用於與大家交流經驗，分享所得。

本人的個人網站採用nodejs平台的express架構與MYSQL資料庫。網頁前端UI使用了網上開源的bootstrap架構。

express版本為4.11.0。

網站大體由三個主要頁面組成：blogs, projects, contact

blogs頁面顯示每個文章的第一段。點進文章之後的頁面叫article

外加隱藏的login介面用於管理員的登入。

網站的路由初步規劃是這樣的：

‘/’與’/blogs’路徑請求使用blog.ejs檔案進行渲染。

‘/login’, ‘/project’, ‘/contact’三個路徑請求分別使用login.ejs, project.ejs, contact.ejs三個檔案進行渲染。

‘/blogs/articla/:articleNum’路徑請求使用article.ejs檔案進行渲染。articleNum變數代表每個部落格文章的id。

projects頁面目前還沒有進行設計。

blogs.ejs中，用於顯示每個縮減文章的html代碼如下：　　

<div class=‘blog-container‘>    <div class=‘row‘>        <div class=‘col-lg-3‘>            <h5 class=‘text-center‘><%= blogsArray[i][‘blog_time‘].toUTCString() %></h5>            <h5 class=‘text-center‘>Readings: <%= blogsArray[i][‘blog_reading_number‘] %></h5>            <h5 class=‘text-center‘>Author: <%= blogsArray[i][‘blog_author‘] %></h5>        </div>        <div class=‘col-lg-9‘>            <a href=<%= ‘/blogs/article/‘ + blogsArray[i][‘blog_id‘] %>><h3><%= blogsArray[i][‘blog_title‘] %></h3></a>            <% var textArr = blogsArray[i][‘blog_content‘].split(/(?:\r\n|\r|\n)/g); %>            <p><%= textArr[0] %></p>            <% if (textArr.length > 1)            { %>                <a href=<%= ‘/blogs/article/‘ + blogsArray[i][‘blog_id‘] %>>Read more...</a>            <% } %>        </div>    </div></div>

其中前面部分的三個<%=...%>代表的是模板變數，我們現不管它，我們看標籤部分，href為‘/blogs/article/‘與blogsArray[i][‘blog_id‘]相連組成一個新的url。在express的app.js中，關於這部分的代碼如下所示：

app.get(‘/blogs/article/:blog_id‘, function(req, res, next){    connection.query(‘select * from blogs where blog_id = ‘ + req.params.blog_id, function(err, result)    {        if (err)        {            alert(‘Cannot get article‘);        }        else        {            res.article = result;        }        next()    })})

在路由控制的index.js中我使用如下代碼：

router.get(‘/blogs/article/:articleNum‘, function(req, res, next) {     res.render(‘article‘,{        blog: ‘active‘,         projects: ‘‘,         contact: ‘‘,        admin: req.session.admin,        article: res.article    });});

這段代碼指出當擷取到/blogs/article/:articleNum請求時使用article檔案進行渲染，並設定article變數傳遞從資料庫調出的文章資料。資料庫的設計我會在後面詳細介紹。用於儲存文章的表由以下6個欄位組成： 
blog_id int not null auto_increment 
blog_time datetime not null 
blog_title mediumtext not null 
blog_content longtext not null 
blog_reading_number int not null 
blog_author mediumtext not null

nodejs個人網站搭建經驗分享——路由規則設計（1）