2016-06-29 59 views
2

我正在尝试为Koa(v2)提供前端服务。最终,我想使用React。但现在,我只是试图提供一个简单的HTML文件。如何与koa一起服务前端?

应用/ index.html的

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title></title> 
    </head> 
    <body> 
    <h1>Hello World</h1> 
    </body> 
</html> 

server.js

import 'babel-polyfill'; 

import koa from 'koa'; 
import koaRouter from 'koa-router'; 

import serve from 'koa-static'; 
import mount from 'koa-mount'; 

const app = new koa(); 

const router = new router({ prefix: '/koa' }); 

// This route works 
router.get('/', async (ctx) => { 
    ctx.body = 'Hello from Koa!'; 
}); 

app.use(router.routes()); 

const front = new koa(); 

// This route doesn't work. 
front.use(serve(__dirname + '/app')); 

// However, this will work, so then, I'm not using koa-serve correctly? 
// front.use(async (ctx) => { 
// ctx.body = "Mount this."; 
// }); 

app.use(mount('/', front)); 
app.listen(3000); 

那么,如何服务于前端?

回答

1

我已经使用了类似的代码和它的工作对我来说,陌生的,几乎像你的榜样,只是我没有使用异步

const koa = require('koa'); 
const koaRouter = require('koa-router'); 
const mount = require('koa-mount'); 
const serve = require('koa-static'); 
const app = new koa(); 
const router = new koaRouter({ prefix: '/koa' }); 
router.get('/', function *() { 
    this.body = 'Hello from Koa!'; 
}); 
app.use(router.routes()); 
const front = new koa(); 
front.use(serve(__dirname + '/app')); 
app.use(mount('/', front)); 
app.listen(3000); 

尝试使用KOA-sendfile的,只是为了测试一下。我有以下

请注意,我在你的榜样使用KOA路线,不KOA路由器像其他例如

而且也有一个叫做“应用程序”包含的文件夹“index.html”

'use strict'; 
const koa = require('koa'); 
const router = require('koa-route'); 
const mount = require('koa-mount'); 
const sendfile = require('koa-sendfile'); 
const serve = require('koa-static'); 
const app = koa(); 
const ui = koa(); 
const api = koa(); 

// API Mount 
function *apiCall() { 
    this.body='response from api'; 
} 
api.use(router.get('/', apiCall)); 

// UI Mount 
// you have 2 ways: 

// // 1. Using koa-sendfile 
// function *serveIndex() { 
//  this.body='response from ui'; 
//  yield sendfile(this, __dirname + '/app/index.html'); 
//  if (!this.status) this.throw(404); 
// } 
// ui.use(serveIndex); 

// 2. Using koa-static 
ui.use(serve('app')); 

app.use(mount('/api', api)); 
app.use(mount('/', ui)); 

app.listen(3000); 
相关问题