一、简介

本文将主要基于node.js使用express框架搭建一个后台环境，包括如何自定义项目目录、所用依赖以及中间件、路由以及模板引擎、接口数据获取以及文件上传等内容。

二、后台环境搭建

1、新建一个目录node，然后在目录下跑命令：npm init,然后输入一些版本信息；

2、安装Express

运行指令：npm install express --save

3、在根目录下新建一个server.js文件，然后在建立服务器然后监听9999端口，输出hello world！

const express = require('express')

var app = express()

app.get('/',function(req,res){

    res.send('hello world!')

})

app.listen()

在浏览器输入http://localhost:9999就会显示hello world！

三、数据准备，登录注册

　　1、这里使用MySQL数据库与node.js链接。我用的是Navicat图形化工具，当然用其他工具也可以，这里将做登录、get列表数据、post文件上传，分页等功能。先在建立数据库然后创建相应的表。

　　2、创建一个数据库叫node，然后创建一个表user_table，有三个字段ID，username，password。

　　3、做一个注册登录功能

　　根目录下新建一个route文件夹，便于管理路由路径模块管理，然后新建一个regLogin.js文件，然后定义router，引入MySQL，建立连接池，然后定义登录跟注册路由，然后导出路由；

const express = require('express');

const router = express.Router();

const mysql = require('mysql');

//连接池

var db = mysql.createPool({host:'localhost',user:'root',password:'*******',database:'node'})

  // 定义网站主页的路由

  router.use('/login', function(req, res) {

    var username = req.body.username;

    var password = req.body.password;

    db.query(`SELECT * FROM user_table WHERE username='${username}'`,(err,data)=>{

        if (err) {

            console.log(err);

            res.status(500).send('database error').end()

        }

        else{

            if (data[0].password==password) {

                res.send('登录成功！')

            }

        }

    })

  });

  // 定义 about 页面的路由

  router.use('/register', function(req, res) {

    var username = req.body.username;

    var password = req.body.password;

    db.query(`insert into user_table(username,password) values ('${username}','${password}')`,(err,data)=>{

        if (err) {

            console.log(err);

            res.status(500).send('database error').end()

        }

        else{

            res.send('注册成功')

        }

    })

  });

  module.exports = router;

　　4、在server.js里边引入body-parser，body-parser可以自动转换req数据为对象格式，然后使用express.static静态文件托管

const express = require('express')

const regLogin =require('./route/regLogin');//引入路由

const bodyParser = require('body-parser');

var app = express()

app.use(bodyParser.urlencoded({ extended: false }))

//使用路由

app.use('/', regLogin)

//静态文件托管

app.use(express.static('static'));

app.listen(9999)

5.在static静态文件夹下新建以下文件

login.html对注册跟登录的post请求，代码如下：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>Login</title>

    <script src="jquery.js"></script>

    <script>

        window.onload=function(){

            //注册

            $('#register').click(function(){

                var name = $('#name').val();

                var pass = $('#password').val();

                $.ajax({

                    type:'POST',

                    url:'/register',

                    data:{username:name,password:pass},

                    success:function(res){

                        alert('注册成功')

                    }

                })

            })

            //登录

            $('#login').click(function(){

                var name = $('#name').val();

                var pass = $('#password').val();

                $.ajax({

                    type:'POST',

                    url:'/login',

                    data:{username:name,password:pass},

                    success:function(res){

                        alert('登录成功')

                    }

                })

            })

        }

    </script>

</head>

<body>

    <div>

        用户名：<input type="text" id="name"/><br/>

        密码：<input type="text" id="password"/><br/>

        <button id="login">登录</button>

        <button id="register">注册</button>

    </div>

</body>

</html>

6.校验

当输入用户名密码，点击注册，则显示注册成功，数据库多了一条用户数据。

点击登录则显示登录成功。

四、文件上传功能

1、文件上传功能需要依赖第三方中间件multer，当然multer有一些参数，可以选择一次上传单个文件，也可以上传多个或者不限制，定义相应的输出路径等参数，详情可以看下官方文档https://www.npmjs.com/package/multer。这里首先在server.js里引入multer并设置参数：

const multer = require('multer');

//输出文件路径

const multerObj = multer({dest:'./static/upload'});

app.use(multerObj.any())

2、新建路由upload.js文件以及static目录下的upload.html上传文件，并在server.js中引入upload路由。

upload.js代码如下：

const express = require('express');

const mysql = require('mysql');

const pathLib = require('path')

const fs = require('fs')

var router = express.Router();

//连接池

var db = mysql.createPool({host:'localhost',user:'root',password:'*******',database:'node'});

router.post('/',function(req,res){

    var title = req.body.title;

    if (req.files[0]) {

        var extName = pathLib.parse(req.files[0].originalname).ext;

        var oldName = req.files[0].path;

        var newName = req.files[0].path+extName;

        var newFileName = req.files[0].filename + extName;

        //重命名加上后缀

        fs.rename(oldName,newName,(err)=>{

            if (err) {

                console.log(err);

                res.status(500).end();

            }

        })

        db.query(`INSERT INTO upload_table (title,src) VALUES ('${title}','${newFileName}')`,(err,data)=>{

            if (err) {

                console.log(err);

                res.status(500).send('err').end()

            }else{

                res.send('上传成功').end()

            }

        })

    }

})

module.exports = router;

3、当选择文件上传，数据库中就会多一天记录

五、模板引擎

　　nodejs模板引擎比较常用的有jade跟ejs,jade跟我们平常时的HTML模板不兼容，而ejs跟我们平时所用的前端代码而已结合使用，所以这里将介绍使用ejs，对jade感兴趣的话也可以去了解了解。

1、首先，引入依赖consolidate，consolidate集成了很多模板引擎，可以选择其中的某个模板引擎来使用，包括jade和ejs都在里边。

2、在server.js引入consolidate然后定义相应渲染为HTML，然后在定义路径渲染

const consolidate = require('consolidate');

var app = express()

//模板

app.engine('html',consolidate.ejs);

app.set('view engine','html');

app.set('views',__dirname + '/template');

app.get('/index',function(req,res){

    res.render('index.ejs',{name:'smile',text:'这是后台返回渲染数据',flag:true});

    //res.send('index')

})

3、在template文件夹中新建一个index.ejs，

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>index</title>

</head>

<body>

    <div class="warp">

        <% include components/header.ejs%>

        <div>

            这是首页

            <div>名称：<%=name%></div>

            <div>text:<%=text%></div>

            <%if(flag){ %>

                <div>这是flag等于true</div>

            <% } %>

        </div>

    </div>

</body>

</html>

4、最后渲染出来的页面如下：

六、cookie跟session

　　1、要使用cookie以及session，得引入两个依赖，cookie-parser,cookie-session,

　　2、使用cookie

var express      = require('express')

var cookieParser = require('cookie-parser')

var app = express()

app.use(cookieParser())

app.get('/cookie', function(req, res) {

  console.log('Cookies: ', '这是返回的cookie')

})

3、使用session

var cookieSession = require('cookie-session')

var express = require('express')

var app = express()

app.use(cookieSession({

  name: 'session',

  keys: ['key1','key2','key3'],//secret keys

  // Cookie Options

  maxAge: 24 * 60 * 60 * 1000 // 24 hours

}))

七、express生成器

　　如果不愿意自己搭建项目架构，可以使用express生成器来快速创建一个应用的骨架。首先全局安装 express-generator，再跑一些初始命令然后下载一些依赖就可以了，也是比较简单，具体步骤参照下文档就可以http://www.expressjs.com.cn/starter/generator.html。

　　

用Express、MySQL搭建项目（接口以及静态文件获取、文件上传等）的更多相关文章

  1. mvc5 + ef6 + autofac搭建项目（四）.1视屏上传生成截图

    即上一篇中上传涉及到的 一个视频生成截图的问题,这个很简单,这是上一篇中的代码片段 #region 视频上传,生成默认展示图片(自动剪切) try { string fileSavePath = Da ...

  2. springboot成神之——springboot+mybatis+mysql搭建项目简明demo

    springboot+mybatis+mysql搭建项目简明demo 项目所需目录结构 pom.xml文件配置 application.properties文件配置 MyApplication.jav ...

  3. docker搭建yapi接口文档系统、Idea中上传接口、在线调用

    一.前言 在我们后端开发中,必不可少的是接口的交接,有很多种方式,常见的就是swagger,不过这个侵入性太强了.还有就是接口文档的框架,比如今天小编带大家一起搭建的yapi,在公司还是挺常见的! 今 ...

  4. Spring Boot 静态资源映射与上传文件路由配置

    默认静态资源映射目录 默认映射路径 在平常的 web 开发中,避免不了需要访问静态资源,如常规的样式,JS,图片,上传文件等;Spring Boot 默认配置对静态资源映射提供了如下路径的映射 /st ...

  5. 手把手教你 通过 NuGet.Server 包 搭建nuget服务器，并使用桌面工具上传 nuget 包，免命令行

    新建web项目 工具:VS2013 版本:.Net Framework 4.6,低版本也行,不过要找到对应版本的Nuget.Server 装了NuGet客户端(百度如何安装) WebForm或MVC都 ...

  6. maven项目的运行方式，maven私服的上传下载

    一.maven项目父子工程的运行方式 1.通过父项目的plugin下集成的tomacat run启动 2.通过自身项目的tomcat plugin启动,但前提是所依赖的项目必须全部都install(将 ...

  7. php四个常用类封装 :MySQL类、 分页类、缩略图类、上传类；；分页例子；

    Mysql类 <?php /** * Mysql类 */ class Mysql{ private static $link = null;//数据库连接 /** * 私有的构造方法 */ pr ...

  8. 在ASP.NET项目中使用CKEditor +CKFinder实现图片上传功能

    前言 之前的项目中一直使用的是FCKeditor,昨天突然有个想法:为什么不试一下新的CKEditor呢?于是花了大半天的时间去学习它的用法,现在把我的学习过程与大家分享一下. 谈起FCKeditor ...

  9. Java开源内容管理CMS系统J4CMS支持静态化直接ftp上传到你的空间了

    页面可直接编辑的cms系统j4cms能够直接支持使用ftp 输出 html到你的空间了 真正的静态化 这是静态化后的站点 http://www.j4cms.com/ 源代码上传至csdn了,能够下载源 ...

随机推荐

  1. Neo4j学习笔记(2)——数据索引

    和关系数据库一样,Neo4j同样可以创建索引来加快查找速度. 在关系数据库中创建索引需要索引字段和指向记录的指针,通过索引可以快速查找到表中的行. 在Neo4j中,其索引是通过属性来创建,便于快速查找 ...

  2. 使用Docker搭建Jenkins+Docker持续集成环境（自动化构建发布部署）

    本文介绍如何通过Jenkins的docker镜像从零开始构建一个基于docker镜像的持续集成环境,包含自动化构建.发布到仓库\并部署上线. 0. 前置条件 服务器安装docker,并启动docker ...

  3. BinderPool — Andorid端的“服务发现治理工具”

    导语 最近在学习微服务相关知识,突然想到:微服务的思想虽然是在server端的场景下提出来的,但是无论是server,还是移动端,思想是相通的,移动端也会有多服务的场景,就同样面临多服务需要整合治理的 ...

  4. php代码审计一些笔记

    之前学习了seay法师的代码审计与及80sec的高级审计,整理了一些笔记在印象里面,也发到这里作为记录 1,漏洞挖掘与防范(基础篇) sql注入漏洞            挖掘经验:注意点:登录页面, ...

  5. eclipse从git拉去出现红色方块的解决办法

    1:由于错误已经解决,这里借了一副图,主要是显示这个红色方块,然后贴一下解决方法,日后好脑补: 大家一看肯定都是冲突了,我也是第一次遇到这种错误,贴一下(鼠标右击项目找到如下的Reset): 然后红色 ...

  6. 关于OC中浮点型的计算

    有时候不得不承认,细心观察生活中的细节,有时候会得到很多. 今天和公司朋友一起订了外卖,因为要分账,就突发奇想用代码来算出每个人花了多少钱.最后发现以前没有注意的细节或者不知道的知识,记录下. 我的代 ...

  7. CentOS7卸载自带jdk安装自己的JDK1.8

    1.查看centos自带的jdk rpm -qa | grep Java 2.删除自带的jdk 例如:rpm -e --nodeps java-1.8.0-openjdk-1.8.0.102-4.b1 ...

  8. Jmeter脚本调试之关联----（正则表达式）

    脚本调试 关联,在脚本中,是必应用到的一个设置方法,将脚本中,每次都会动态变化的特殊值进行关联.一个能正确执行的脚本,都需要进行关联(LR.jmeter). Jmeter关联: 在脚本回放过程中,客户 ...

  9. HttpClient（二）HttpClient使用Ip代理与处理连接超时

    前言 其实前面写的那一点点东西都是轻轻点水,其实HttpClient还有很多强大的功能: (1)实现了所有 HTTP 的方法(GET,POST,PUT,HEAD 等) (2)支持自动转向 (3)支持 ...

  10. 2017ecjtu-summer training #1 UVA 12050

    A palindrome is a word, number, or phrase that reads the same forwards as backwards. For example, th ...