node服务器部署前端代码

# 前言：

　　上一篇博客三·丰·云免费服务器初体验使用三·丰·云免费云服务器已经将node环境搭建完毕，后面也试了下他家的免费虚拟主机，但是连接ftp上传文件，一直上传失败，所以放弃了体验虚拟主机的想法，还是继续搞服务器吧，使用node起服务首先想到的框架有express和koa，对比看了下github上star数，果断选了koa。

　　然后，大概说下需要实现的功能：

　　1. 起一个静态服务器，可以存放前端页面

　　2.支持前端页面使用history模式，跳转页面再刷新不报错

　　3.pm2进程管理

　　4.因为后面需要接入微前端，服务器需要做跨域

　　5.写后台接口

 

一、静态服务器，需要使用koa自己的koa-static

const serve = require('koa-static');

app.use(serve(path.join(__dirname)+'/public/'))

这样就能在当前目录下的public文件夹下起一个静态服务器，如果静态服务需要跨域，需要把跨域中间件放置在serve之前执行

 

二、支持history模式

const { historyApiFallback } = require('koa2-connect-history-api-fallback');

app.use(historyApiFallback());

是基于connect-history-api-fallback实现的koa版本，默认会读取文件夹下的index.html，若不匹配路由，也会默认访问index.html

 

三、pm2管理

npm i pm2 -g

pm2需要全局安装，运行的时候需要配置进程名称，因为关闭进程需要指定名称，当然，不介意关闭全部进程就不用考虑进程名称了

 

四、跨域

app.use(async (ctx, next)=> {
    ctx.set('Access-Control-Allow-Origin', '*');
    ctx.set('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
    ctx.set('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
    if (ctx.method == 'OPTIONS') {
      ctx.body = 200; 
    } else {
      await next();
    }
  });

有两个用途：

• 本地方便调试调接口
• 微前端的子应用需要支持跨域才能访问到子应用页面

跨域也可以使用koa2-cors,然后配置ctx.set('Access-Control-Allow-Origin', '*'),这个需要注意前端请求头是否存在withCredentials:true,服务器也需要配置响应头Access-Control-Allow-Credentials:true,然后Access-Control-Allow-Origin是不能为*号，需要指定域名才生效；

 

五、接口

const Router = require('@koa/router');
const koaBody = require('koa-body');

const Router = require('@koa/router');
const koaBody = require('koa-body');
const { createUser, getUser } = require('../lib/mongo');

const router = new Router();

router
    .get('/test', (ctx, next) => {
        ctx.body = 'Hello World';
    })
    .get('/user', (ctx, next) => {
        console.log('ctx=', ctx)
        ctx.body = `get Hello World ${ctx.params.name}`;
    })
    .post('/user',koaBody(),async (ctx, next) => {
        console.log('ctx=', ctx.request.body)
        try {
            const data = await getUser(ctx.request.body.username);
            console.log('data', data, data.length)
            if (data.length === 0) {
                await createUser(ctx.request.body);
                ctx.body = {status: 200}
            } else {
                ctx.body = {status: 100, msg: '用户已存在'}
            }
        } catch (err) {
            console.log('create失败', err)
            ctx.body = {status: 100, msg: '注册失败'}
        }
    })

module.exports = router;

　　主要使用@koa/router实现接口路由，如果是post请求，需要使用koa-body去解析post传递过来的参数

 

 

总结：基本已经就能实现一个简单的koa服务，后面还会继续优化session，log日志等其它功能。