vue.js+koa2项目实战(四)搭建koa2服务端

搭建koa2服务端

安装两个版本的koa

一、版本安装

1.安装 koa1

npm install koa -g

注:必须安装到全局

2.安装 koa2

npm install koa@2 -g

 

二、创建项目

1.安装 koa 生成器 (koa1 和 koa2 都用此生成器)

npm install koa-generator -g

2. koa1 生成一个 test 项目,切到 test 目录并下载依赖

koa test
cd test
npm install
运行:npm start
访问:http://localhost:3000

3.创建 koa2 项目

koa2 生成一个 test 项目,切到 test 目录并下载依赖

koa2 test
cd test
npm install
运行:npm start
访问:http://localhost:3000

4.axios 向 koa2 发送参数

Login.vue




vue.js+koa2项目实战(四)搭建koa2服务端_第1张图片

5.koa2 配置 路由

vue.js+koa2项目实战(四)搭建koa2服务端_第2张图片

6.koa 跨域访问:

(1)安装插件

npm install koa-cors --save-dev

(2)项目的 app.js 中

var cors = require('koa-cors')

app.use(cors())  // 放在route前面

 

app.js

const Koa = require('koa')
const app = new Koa()
const views = require('koa-views')
const json = require('koa-json')
const onerror = require('koa-onerror')
const bodyparser = require('koa-bodyparser')
const logger = require('koa-logger')
// 解决跨域访问问题
var cors = require('koa-cors')

const index = require('./routes/index')
const users = require('./routes/users')

// error handler
onerror(app)

// middlewares
app.use(bodyparser({
  enableTypes:['json', 'form', 'text']
}))
app.use(json())
app.use(logger())
app.use(require('koa-static')(__dirname + '/public'))

app.use(views(__dirname + '/views', {
  extension: 'pug'
}))

// logger
app.use(async (ctx, next) => {
  const start = new Date()
  await next()
  const ms = new Date() - start
  console.log(`${ctx.method} ${ctx.url} - ${ms}ms`)
})

// 使用 cors
app.use(cors())

// routes
app.use(index.routes(), index.allowedMethods())
app.use(users.routes(), users.allowedMethods())

// error-handling
app.on('error', (err, ctx) => {
  console.error('server error', err, ctx)
});

module.exports = app

 

.

你可能感兴趣的:(vue.js+koa2项目实战(四)搭建koa2服务端)