koa2教程【mysql,路由,跨域,静态服务】
2017-11-07 本文已影响456人
她来听我的演唱会hez
做人有原则,就什么都不怕
没有受过伤的人,才会讥笑别人身上的伤痕! ---《罗密欧与朱丽叶》
本文主要讲koa项目的建立,数据库连接配置,静态资源服务,路由管理。读完3分钟,也可做练手的教程。
先看项目目录
koa2项目目录lib —— 数据库
node_modules —— 依赖库
routers —— 路由
static ——静态资源
app.js —— 项目入口文件
package-lock.json —— webpack配置文件
简单的说下项目各部组合思想
1:app启动页,项目的入口,兼顾整个项目。因此,依赖,配置,都在这里
2:lib数据库管理,后端工程师的核心工作内容就是数据,增删改查。(每个功能的方法都不一样,都写在这里,所以需要分离,后期项目庞大,各个功能都要区分单独的文件管理)
3:静态资源,为什么?后端,前端的的react或vue都是静态的资源,打包后放在这里,关闭跨域访问,数据更安全。
中小形的项目就这样的结构了。或许,应该足够了。结下来,逐一分析。
一: app.js 项目入口
具体的怎么用,代码上都有,
const Koa = require('koa')
const bodyParser = require('koa-bodyparser') //上下文解析
const Router = require('koa-router') //路由
const static = require('koa-static') //静态资源服务
const path = require('path')
const cors = require('koa-cors') //跨域访问组件
const app = new Koa()
// 配置静态资源文件
const staticPath = './static'
app.use(static(
path.join( __dirname, staticPath)
))
// 允许跨域访问
app.use(cors())
// body解析
app.use(bodyParser())
app.use(require('./routers/index').routes())
app.listen(3000)
console.log("启动成功")
各个中间件的解释:
- 所有引入的资源都要在事先使用npm安装好
- koa: 项目的核心组件
- koa-bodyparser: 用来解析body的中间件,假如你post来传递表单,json数据,或者上传文件,在koa中是不容易获取的,通过koa-bodyparser解析之后,在koa中this.body就能直接获取到数据。
- koa-router:koa的路由中间间。
- koa-static : koa的静态资源服务中间件
- path: 路径获取中间件
- koa-cors : 允许跨域请求的中间间,假设node的服务在3000端口,react的服务在3001。react获取node的json时候。跨域了。搞jsonp就麻烦多了。线上的时候根本用不到。
配置好各项中间件,设置好启动端口,蓄势待发!!!
二:(router/index.js) 路由管理
不啰嗦,看代码。都有注释
const router =require('koa-router')(); //路由
const userModel = require('../lib/mysql') //数据库方法
router.get('/',async(ctx,next) => {
ctx.redirect('/index')
})
router.get('/index',async(ctx,next) => {
let html = `
<h1> 老子吃火锅,你吃火锅底料 --gai </h1>
`
ctx.body = html
})
router.get('/api',async(ctx,next) => {
let resd = ''
await userModel.findAllPost()
.then(result => {
resd = JSON.parse(JSON.stringify(result))
// console.log(resd)
})
ctx.body = resd
})
module.exports= router
各个中间件的解释
- 引入路由组件,注意,是执行函数的的。加括号
- 数据库引入,引入增删改查的方法库,后面数据管理还有讲
- router.get() 路由中间件提供的方法,koa2的的最大的便捷之处就是使用es6的async异步写法。
- 请求体,响应体。要这么去理解,router.get('/index')这是请求体,koa去识别出来后,便执行响应体。
- 响应体 let html='' 响应的内容,后面复杂的编程时,获取的内容是从数据库加工处理后的内容。
- ctx.body = html 响应体返回的内容 【看下面的代码】
router.get('/index',async(ctx,next) => {
let html = `
<h1> 老子吃火锅,你吃火锅底料 --gai </h1>
`
ctx.body = html
})
全都返回json,让前端工程师更忙碌吧,熟悉mysql,开发之前架构设计好,能省很大的力 0.。0
三:lin 数据库管理,配置
两部分:1配置(config.js), 2,方法(mysql.js)
// 数据库配置
const config = {
port: 3000,
database:{
DATABASE:'111', //数据库
USERNAME:'hez', //用户
PASSWORD:'aS62681***', //密码
PORT:'3306', //端口
HOST:'39.106.12.86' //网址ip
}
}
module.exports = config
因为线上的,我注释密码了
const mysql = require('mysql')
const config = require('./default')
var pool = mysql.createPool({
host:config.database.HOST,
user:config.database.USERNAME,
password:config.database.PASSWORD,
database:config.database.DATABASE
});
let query = function( sql, values ) {
return new Promise(( resolve, reject ) => {
pool.getConnection(function(err, connection) {
if (err) {
resolve( err )
} else {
connection.query(sql, values, ( err, rows) => {
if ( err ) {
reject( err )
} else {
resolve( rows )
}
connection.release()
})
}
})
})
}
// 查询t1数据库
let findAllPost = function () {
let _sql = `
SELECT * FROM hez1
`
return query(_sql)
}
module.exports={
findAllPost
}
害怕,我懒!!!
- 需要配置项,因为有线上,线下,各重版本。所以把配置项独立出来会好方便很多
- 再多说一次,后端工作的核心就是数据,真诀,增删改查
- mysql写的好,处理起数据来还是很省心的。使用js函数将sql方法写好封装起。暴露出来再各个组件,模块中使用。
// 查询t1数据库
let findAllPost = function () {
let _sql = `
SELECT * FROM hez1
`
return query(_sql)
}
四:运行项目
当控制台返回数据的时候,表示成功
控制台的打印日志- 页面路由进入/api,返回数据,表示成功。
- 当然,也能数据库忽略,页面返回 老子吃火锅,你吃火锅底料--gai 也表示成功
其实,项目要git,提交到代码管理平台。大家一起开发,各人负责一块业务的开发,之后我会再写一篇git的文章,平台大概是码云,github。
项目代码地址,下一篇文章是在linx服务器(CentOS 7.3系统)部署koa项目。内容有koa2服务建立,nginx代理,mysql安装,用户管理,系统常用指令。
js全栈工程师必看的网址 我的个人网址,(还在建设中...)
关注我吧,因为写react,koa,mysql,vue,reactNative等api,及技巧。不信关注我的微信或qq(626815494)看看。
扫一扫,添加作者微信