node服务端渲染（koa）

最新推荐文章于 2024-01-16 09:51:15 发布

冰中何人知

最新推荐文章于 2024-01-16 09:51:15 发布

阅读量1.1k

点赞数

分类专栏： node笔记文章标签： node koa

本文链接：https://blog.csdn.net/weixin_44167314/article/details/85090304

版权

node笔记专栏收录该内容

0 篇文章 0 订阅

订阅专栏

node做服务端极简笔记：
快速搭建一个node服务（默认读者会ejs模板渲染语法），package.json在外层文件夹，另外三个文件在内层src文件夹，文件夹路径如图在这里插入图片描述，

package.json内容：

{
  "name": "koa-demos",
  "version": "1.0.0",
  "description": "a simple demo of Koa",
  "scripts": {
    "dev": "node src/main"
  },
  "keywords": ["Koa", "Node"],
  "author": "Zach He",
  "license": "ISC",
  "dependencies": {
    "fs.promised": "^3.0.0",
    "koa": "^2.3.0",
    "ejs": "^2.5.9",
    "koa-bodyparser": "^4.2.0",
    "koa-compose": "^4.0.0",
    "koa-router": "^7.2.1",
    "koa-static": "^4.0.1",
    "koa-views": "^6.0.2",
    "form-data": "^2.2.0",
    "node-fetch": "^2.1.1"
  }
}

template.html

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <title><%= title %></title>
  <meta name="description" content="HTML5 Template">
  <meta name="author" content="xxx"> 
</head>

<body>
	<% include index.html %>
    <h1>Hello World  <%= name %></h1>
    <h2>Hello，<%- name %></h2>
</body>
<script>
	var a ='<%= name %>';
	console.log(a);
</script>
</html>

index.html

<p>这个是测试啊啊啊</p>

main.js

const Koa = require('koa');
const router = require('koa-router')();
const app = new Koa();
const views = require('koa-views')
const fetch = require('node-fetch');
const FormData = require('form-data');

//模板引擎
app.use(views(__dirname + '/', {   //模板引擎
    map: {
        html: 'ejs'
    }
}))

const main = async (ctx) => {
	fetch('https://easy-mock.com/mock/5ca30e261d085748d8ff9876/example/koa',{ method: 'POST',body:{}}).then(res => res.json()).then(json => console.log(json));
	await ctx.render("template", { 
            name: 'Home Page', 
            title: ctx.pubInfo
        })
};
const info = async (ctx, next)=> {
	ctx.pubInfo = '测试啊';
	try{
        await next();
    }catch(e){
    	const msg = e.stack || e.toString();
    	console.log(msg)
    }
}

router.get('/', info, main);

app.use(router.routes());
console.log('looking for http://localhost:3000');

app.listen(3000);

运行代码：
1、安装依赖 npm install
2、npm run dev
3、访问http://localhost:3000

成功后的页面效果如图，红框部分为node服务端动态渲染内容
在这里插入图片描述

冰中何人知

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
node服务端渲染（koa）

package.json内容：{ "name": "koa-demos", "version": "1.0.0", "description": "a collection of simple demos of Koa", "scripts": { "test": "echo \"Error: no te
复制链接

扫一扫

专栏目录