使用koa.js显示静态html文件

Question

我想要做的是在调用索引路由(即localhost:3000)时提供index.html文件.

我使用koa-router进行路由,所以我的路由如下:

app.all("/", function * (next){
    //Send the file here
});

我试着像这样使用koa-static:

var serve = require('koa-static');
 app.all("/", function * (next){
        serve("index.html");
    });

但那没用.然后我尝试使用co-views(我现在将html文件放在公共目录中):

var views = require("co-views");
var render = views("public");
app.all("/", function * (next){
    this.status = 200;
    this.body = yield render("index.html");
});

但那没用.

那么有谁能告诉我我必须做什么？

Answer 1

那么有几种方法可以做到,这里有两个.

模板引擎

最简单的方法可能是使用像swig或jade这样的模板引擎来提供文件.

安装它做:

npm install -s swig

为了与合作观点一起做,就这样做

var views = require("co-views");
var render = views("public", { map: { html: 'swig' });
app.all("/", function * (next){
  this.body = yield render("index");
}); 

纯文件系统

或者,如果您不想使用模板引擎,则可以使用普通节点文件系统库.

为了能够将它与yield一起使用,您必须将函数包装在promise中.

var fs = require('fs');

var readFileThunk = function(src) {
  return new Promise(function (resolve, reject) {
    fs.readFile(src, {'encoding': 'utf8'}, function (err, data) {
      if(err) return reject(err);
      resolve(data);
    });
  });
}

app.use(router.get('/', function *(){
  this.body = yield readFileThunk(__dirname + '/public/htmlfilename.html');
}));

另请注意,如果您使用koa-static,并且将index.html放在公共文件夹(链接到koa-static的文件夹)中,则默认情况下它将在根URL上提供index.html,而无需任何代码.这是一个惯例.

Answer 2

将文件流传递给koa正文

这与使用普通文件系统的上述解决方案非常相似,但它利用koa功能将可读流作为响应主体传递.所以我们唯一需要做的就是打开一个可读的文件流并将其传递给koa上下文体.在此之前给koa一个提示,这是html类型的响应.

import { createReadStream } from 'fs';

public async handle(ctx, next) {
    ctx.type = 'html';
    ctx.body = createReadStream('index.html');
}