一.具体创建自动化环境和环境搭建在上面已经发布,如果还不了解的请打开链接:http://blog.csdn.net/qq_16664643/article/details/52260658
一.index.ejs
<% include header %>
<div class="row"><div class="col-9">
<div class="ui-list">
<div class="ui-position ui-img"><img src="images/1.jpg"></div>
<div class="article">
<h1>atom编辑器快捷键大汇总</h1>
<p>Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScript等网页编程语言。它支持宏,自动完成分屏功能,集成了文件管理器。由于有着 GitHub 的光环,不少人正在试用。下面是总结的一些 Atom 快捷键列表,喜欢高效键盘操作的朋友不妨看看。</p>
<div class="ui-list-info">
<span>点击数:1000次</span>
</div>
</div>
</div>
<div class="ui-list">
<div class="ui-position ui-img"><img src="images/1.jpg"></div>
<div class="article">
<h1>atom编辑器快捷键大汇总</h1>
<p>Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScript等网页编程语言。它支持宏,自动完成分屏功能,集成了文件管理器。由于有着 GitHub 的光环,不少人正在试用。下面是总结的一些 Atom 快捷键列表,喜欢高效键盘操作的朋友不妨看看。</p>
<div class="ui-list-info">
<span>点击数:1000次</span>
</div>
</div>
</div>
<div class="ui-list">
<div class="ui-position ui-img"><img src="images/1.jpg"></div>
<div class="article">
<h1>atom编辑器快捷键大汇总</h1>
<p>Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScript等网页编程语言。它支持宏,自动完成分屏功能,集成了文件管理器。由于有着 GitHub 的光环,不少人正在试用。下面是总结的一些 Atom 快捷键列表,喜欢高效键盘操作的朋友不妨看看。</p>
<div class="ui-list-info">
<span>点击数:1000次</span>
</div>
</div>
</div>
</div>
<div class="col-3">
<div class="ui-right-item">
<h1>博文列表</h1>
<hr>
<div class="ui-right-item-content">
<ul>
<li><a href="#">这是博客文章列表</a></li>
<li><a href="#">这是博客文章列表</a></li>
<li><a href="#">这是博客文章列表</a></li>
<li><a href="#">这是博客文章列表</a></li>
<li><a href="#">这是博客文章列表</a></li>
</ul>
</div>
</div>
</div>
</div>
<%include footer %>
三.header.ejs
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel="stylesheet" href="stylesheets/comm.css">
<link rel="stylesheet" href="stylesheets/style.css">
<script src="javascripts/plug/jquery-1.9.1.min.js"></script>
</head>
<body>
<header>
<nav>
<a href="#">首页</a>
<a href="#">博文</a>
<a href="#">资源下载</a>
<a href="#">招聘</a>
<a href="#">关于我们</a>
<a href="#">登录</a>
<a href="#">注册</a>
</nav>
</header>
<article class="container">
四.footer.ejs
</article>
<footer>
<p>未来之光</p>
</footer>
<script src="javascripts/comm.js"></script>
</body>
</html>
五.addblogs.ejs
<% include header %>
<div class="warrper">
<div class="ui-input">
<form enctype="multipart/form-data" id="blogsform" action="/addBlog" method="post">
<input type="text" name="titles" placeholder="请输入标题">
<div class="post-content">
<textarea name="contents" id="contents"></textarea>
</div>
<input type="submit" value="提交">
</form>
</div>
</div>
<!--<script>
$(function(){
$("input[type='submit']").click(function(){
/* var param = {};
param.title=$('input[name=titles]').val();
param.content=$('input[name=contents]').val();
param.pic=$('input[name=pic]').val();*/
var param=$("#blogsform").serialize();
$.post('/addBlog',param,function(data){
console.log(data);
console.log(document.cookie);
});
});
})
</script>-->
<%include footer %>
六.index.js路由页面
var express = require('express');
var router = express.Router();
var crypto=require('crypto');
var User=require('../models/user.js');
var Post=require('../models/post.js');
//首页
router.get('/', function(req, res, next) {
//username传空值,在首页上显示所有用户发言
Post.get(null,function(err,posts){
if(err){
posts=[];
}
res.render('index',{title:'index',posts:posts});
});
});
//用户页
router.get('/u/:user', function(req, res, next) {
User.get(req.params.user,function(err,user){
if(!user){
req.flash('error','用户不存在');
res.redirect('/');
}else{
Post.get(user.name,function(err,posts){
if(err){
req.flash('error',err);
res.redirect('/');
}else{
res.render('user',{title:user.name,posts:posts});
}
})
}
});
});
router.post('/post',checkLogin);
//评论页
router.post('/post', function(req, res, next) {
var currentUser=req.session.user;
var post=new Post(currentUser.name,req.body.post);
post.save(function(err){
if(err){
req.flash('error',err);
res.redirect('/');
}else{
req.flash('success','发表成功');
res.redirect('/u/'+currentUser.name);
}
});
});
router.get('/reg',checkNotLogin);
//注册页
router.get('/reg', function(req, res, next) {
res.render('reg',{title:'用户注册'});
});
router.post('/reg',checkNotLogin);
router.post('/reg', function(req, res, next) {
//检查用户两次输入的口令是否一致
if(req.body['password-repeat']!=req.body['password']){
console.log("jkjkj");
req.flash('error','两次输入的口令不一致');
return res.redirect('/reg');
}
//生成口令的散列值
var md5=crypto.createHash('md5');
var password=md5.update(req.body.password).digest('base64');
var newUser=new User({
name:req.body.username,
password:password
});
//检查用户名是否已存在
User.get(newUser.name,function(err,user){
//如已存在此用户名,返回并提示
if(user)
err='Username already exists.';
if(err){
req.flash('error',err);
return res.redirect('/reg');
}
//如不存在则新增用户
newUser.save(function(err){
if(err){
req.flash('error',err);
return res.redirect('/reg');
}
req.session.user=newUser;
req.flash('success','注册成功');
res.redirect('/');
});
})
});
router.get('/login',checkNotLogin);
//登录页
router.get('/login', function(req, res, next) {
res.render('login',{title:'用户登入'});
});
router.post('/login',checkNotLogin);
router.post('/login', function(req, res, next) {
//生成口令的散列值
var md5=crypto.createHash('md5');
var password=md5.update(req.body.password).digest('base64');
var username=req.body.username;
User.get(username,function(err,user){
if(!user){
req.flash('error','用户名不存在');
return res.redirect('/login');
}else{
if(user.password===password){
req.flash('success','登录成功');
req.session.user=user;
return res.redirect('/');
}else{
req.flash('error','密码错误');
return res.redirect('/login');
}
}
});
});
router.get('/logout',checkLogin);
//登出页
router.get('/logout', function(req, res, next) {
req.session.user=null;
req.flash('error','登出成功');
res.redirect('/');
});
module.exports = router;
//确认未登入,已登入不能登录及注册
function checkNotLogin(req,res,next){
if(req.session.user){
req.flash('error','已登入');
res.redirect('/');
}else{
next();
}
}
//确认已登入,未登入不能登出,并且转向登录页面
function checkLogin(req,res,next){
if(req.session.user){
next();
}else{
req.flash('error','未登入');
res.redirect('/login');
}
}