Node框架 【Koa】之 【静态资源管理、模板引擎、连接数据库】

news2024/11/15 13:43:23

文章目录

  • 🌟前言
  • 🌟静态资源托管
    • 🌟安装
    • 🌟使用
  • 🌟Koa视图
    • 🌟EJS模板引擎使用
    • 🌟安装
    • 🌟配置
    • 🌟使用
      • 🌟模板渲染方法
      • 🌟使用案例
  • 🌟数据库
  • 🌟写在最后

在这里插入图片描述

🌟前言

哈喽小伙伴们,新的专栏 Node 已开启;这个专栏里边会收录一些Node的基础知识和项目实战;今天我们继续带大家了解Node的框架 Koa ;让我们一起来看看吧🤘

🌟静态资源托管

为了提供诸如图像、CSS 文件和 JavaScript 文件之类的静态文件,请使用 koa-static包。

🌟安装

安装静态文件模块:

npm i koa-static -S

🌟使用

const static_ = require('koa-static')

app.use(static_(
    path.join(__dirname, './static')
))

这样的一两句代码,就完成了一个静态服务器的搭建,static 目录下的文件,就能支持通过路径访问。

🌟Koa视图

koa-views 是一个视图管理模块,它的灵活度很高,支持很多的模版引擎,这里我们给它配置的引擎是 ejs。

🌟EJS模板引擎使用

关于EJS模板引擎详细使用,请查看文档 架构模式 > MVC架构模式 > EJS模板引擎

🌟安装

npm i koa-views
npm i ejs

🌟配置

views(root[, opts])

参数描述:

  • root: 模板所在的位置。可以是相对路径也可以是绝对路径,所有渲染模板都是相对于此路径的
  • opts (可选参数)
  • opts.autoRender: 是否使用 ctx.body 接收渲染的模板字符串。默认为true。
  • opts.extension: 模板文件的默认扩展名,默认为html
  • opts.map: 将指定模板文件扩展名映射到模板引擎

配置1:使用默认后缀,此时的模板文件后缀名为.ejs

const views = require('koa-views')
const path = require('path')

// 配置视图
app.use(views(path.join(__dirname, './views'), {
    extension: 'ejs'
}))

配置2:设置模板引擎后缀为html,此时的模板文件后缀名为.html

// 配置视图
app.use(views(path.join(__dirname, './views'), {
    map: {html:'ejs'}
}))

🌟使用

🌟模板渲染方法

ctx.render(viewPath, locals ):Promise

参数描述:

  • viewPath:一个字符串,view是要渲染的模板文件的文件路径。
  • locals:一个对象,其属性定义视图的局部变量。

🌟使用案例

我们新建一个 views 目录,这里面存放我们的视图文件,在新建一个 index.ejs。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ejs</title>
</head>
<body>

<%=message%> <!-- ejs 的模版语法,读取变量 message | 是从 render 传递过来 -->

</body>
</html>

app.js

app.use(async (ctx, next) => {
  await ctx.render('index', {message: 'index'}) // render 渲染方法,这里加载到 views/index.ejs 文件 | 第二参数是传参到模版
  await next()
})

🌟数据库

mysql2是一个高性能的MySQL驱动程序。

安装:

npm install --save mysql2

使用:

const http = require('http');
const mysql = require('mysql2/promise');
const Koa = require('koa');

// create the pool
const pool = mysql.createPool({
    connectionLimit:10, //连接数,默认10个
    host:'localhost',
    user:'root',
    password:'',
    database:'数据 库名'
    port:3306   //默认服务器端口
});

let App = new Koa();
App.listen(8080);

App.context.db = pool; //可以在任意模块中使用 ctx.db操作数据库

App.use(async (ctx,next)=>{
  try{
    //可以使用async await的书写形式
    let data = await ctx.db.query('SELECT * FROM 表名');
    next();
  }catch(e){
    console.log('error',e);
  }
});

关于mysql2的使用,请参考 第三方包>mysql

🌟写在最后

更多Node知识以及API请大家持续关注,尽请期待。各位小伙伴让我们 let’s be prepared at all times!

✨原创不易,还希望各位大佬支持一下!
👍 点赞,你的认可是我创作的动力!
⭐️ 收藏,你的青睐是我努力的方向!
✏️ 评论,你的意见是我进步的财富!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/505244.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

OBS直播时编码器、码率控制器、分辨率帧率是什么以及如何向第三方推流

内容摘要&#xff1a;OBS直播时编码器、码率控制器、分辨率、帧率到底是什么&#xff0c;以及OBS向第三方直播平推流时&#xff0c;要注意什么。 图&#xff1a;OBS直播时输出界面参数设定 OBS编码器 1. 软编&#xff1a;x264 使用CPU进行编码&#xff0c;占用CPU资源多&…

m3u8文件

#EXTM3U&#xff1a;m3u文件头&#xff0c;必须放在第一行&#xff0c;起标示作用&#xff1b; #EXT-X-VERSION&#xff1a;播放列表文件的兼容版本。若不存在此标记&#xff0c;则默认为协议的第一个版本&#xff1b; #EXT-X-MEDIA-SEQUENCE&#xff1a; 播放列表中的每个媒…

第1章计算机系统漫游之 “操作系统管理硬件“

7、操作系统管理硬件 回到 hello 程序的例子。当 shell 加载和运行 hello 程序时&#xff0c;当 hello 程序输出自己的消息时&#xff0c;程序没有直接访问键盘、显示器、磁盘或主存储器。取而代之的是&#xff0c;它们依靠操作系统提供的服务。 可以把操作系统看成是应用程序…

王琤:当数据治理遇上ChatGPT

以ChatGPT为代表的人工智能等技术正在“狂飙”&#xff0c;为全球带来一场翻天覆地的变革。4月27日在2023数据治理新实践峰会上&#xff0c;Datablau数语科技创始人&CEO王琤先生以《数据治理新实践与人工智能》为主题进行了分享&#xff0c;与参会同仁共同探索当数据治理遇…

APP开发的上线流程

APP的使用已经非常普及&#xff0c;对于企业来说通过APP可以加强和客户的沟通&#xff0c;展现最新的产品和服务。随着APP应用商店对用户隐私的重视&#xff0c;APP的上线规则比以前更加复杂&#xff0c;甚至出现APP需要反复修改数十次才能上架的问题&#xff0c;今天和大家分享…

移远通信参加2023中国移动5G发展大会 ,共探5G创新未来

5月6日&#xff0c;以“聚力5G创新&#xff0c;共铸百业绽放”为主题的中国移动5G发展大会在郑州国际会展中心召开。作为5G赋能千行百业的重要贡献者&#xff0c;移远通信应邀参加大会&#xff0c;并深度参与了大会的多个环节。 会上&#xff0c;中国移动系列创新成果发布&…

【Linux】Linux安装tomcat(图文解说详细版)

文章目录 1、安装前置条件2、下载所需压缩包&#xff0c;上传到服务器3、对资源进行解压4、给防火墙添加访问端口&#xff08;默认8080&#xff0c;在它的/conf/server.xml文件里面查看&#xff09;5、然后切换到bin目录下&#xff0c;启动&#xff08;成功效果如图&#xff09…

批量任务导致页面卡死解决方案

需求背景 需要基于高德地图展示海量点位&#xff08;大概几万个&#xff09;&#xff0c;点位样式要自定义&#xff08;创建DOM&#xff09;&#xff0c;虽然使用了聚合点&#xff0c;但初始化时仍需要将几万个点位的DOM结构都创建出来。 这里补充一句&#xff0c;高德地图在2.…

为什么剑桥出身的“AI教父”辛顿会担心?

剑桥很有意思&#xff01;在那儿呆过的人常常有这样一种感觉&#xff1a;剑&#xff0c;很锋利&#xff01;桥&#xff0c;很温柔&#xff01;剑桥的科技自不必说&#xff0c;牛顿、达尔文、麦克斯韦、爱丁顿......&#xff0c;剑桥的人文却也不让科技&#xff0c;拜伦、培根、…

使用asp.net core web api创建web后台,并连接和使用Sql Server数据库

前言&#xff1a;因为要写一个安卓端app&#xff0c;实现从服务器中获取电影数据&#xff0c;所以需要搭建服务端代码&#xff0c;之前学过C#&#xff0c;所以想用C#实现服务器段代码用于测试&#xff0c;本文使用C#语言&#xff0c;使用asp.net core web api组件搭建服务器端&…

【软考备战·希赛网每日一练】2023年5月9日

文章目录 一、今日成绩二、错题总结第一题三、知识查缺 题目及解析来源&#xff1a;2023年05月09日软件设计师每日一练 一、今日成绩 二、错题总结 第一题 解析&#xff1a; 有损、无损连接判断&#xff1a; (A1,A2)∩(A1,A3)A1 (A1,A2)-(A1,A3)A2 (A1,A3)-(A1,A2)A3 所以A1-&…

车载5G放量增长,哪些厂商抢跑

前装标配19.88万辆&#xff0c;同比上年同期增长724.89%&#xff0c;这是一季度中国市场乘用车5G搭载上车交付的成绩。高工智能汽车研究院监测数据显示&#xff0c;2022年全年5G交付搭载41.74万辆&#xff08;不含选装&#xff09;&#xff0c;前装搭载率为2.09%。 这意味着&a…

【Linux】GDB多进程调试

目录 GDB多进程调试 GDB多进程调试 演示父子进程如何进行gdb调试会用到hello.c文件 hello.c文件内容如下&#xff1a; #include <stdio.h> #include <unistd.h>int main() {printf("begin\n");if(fork() > 0) {printf("我是父进程&#xff1…

Baumer工业相机堡盟工业相机如何使用BGAPI SDK进行两个万兆网相机的同步采集

Baumer工业相机堡盟工业相机如何使用BGAPI SDK进行两个万兆网相机的同步采集 Baumer工业相机Baumer工业相机图像数据转为Bitmap的技术背景Baumer同步异常 &#xff1a;客户使用两个Baumer万兆网相机进行同步采集发现FrameID相同&#xff0c;但是图像不同步细节原因解决办法 Bau…

Windows下python中的pip换源

在Windows中更换pip数据源方法&#xff0c;提高Python相关包安装效率 1.在windows环境下&#xff0c;打开我的电脑&#xff0c;在"地址栏"输杰沫入: %APPDATA% 后回车 2.在打开的文件夹中新建 pip 文件夹&#xff08;打开的地址为下图所示&#xff09; 3.进入pip文…

在 Python 中将泊松分布拟合到不同的数据集

文章目录 在 Python 中将泊松分布拟合到不同的数据集在 Python 中拟合泊松分布的分箱最小二乘法程序的导入函数为泊松分布创建一个虚拟数据集并使用该数据集绘制直方图使用曲线拟合将曲线拟合到直方图 使用负二项式拟合过度分散的数据集上的泊松分布创建数据集使用数据集绘制直…

JAVA算法(一)查找算法

一、基本查找 / 顺序查找 核心&#xff1a;从0索引开始挨个往后查找 private static boolean basicSearch(int[] arr, int number) {for (int i 0; i < arr.length; i) {if (arr[i] number) {return true;}}return false;}二、二分查找 / 折半查找 前提&#xff1a;数组…

(四) 打造更加智能的即时通信系统——实现主界面消息和联系人切换效果

文章目录 一、引言二、界面设计的基本要求2.1 界面美观简洁2.2 功能合理布局 三、界面布局和控件设计四、效果展示五、关键代码六、个人经验分享6.1 即时通信系统开发中的经验和总结6.2 遇到的问题和解决方案6.3优化即时通信系统 七、总结 一、引言 当今社会&#xff0c;人们对…

解决 scalac: bad option: ‘-make:transitive‘

scalac: bad option: ‘-make:transitive’ 打开项目所在位置并进入 .idea 修改scala_compiler.xml文件 删除掉参数行包含-make:transitive 保存后 重新运行代码

Linux驱动开发笔记(二):ubuntu系统从源码编译安装gcc7.3.0编译器

若该文为原创文章&#xff0c;转载请注明原文出处 本文章博客地址&#xff1a;https://hpzwl.blog.csdn.net/article/details/130533941 红胖子网络科技博文大全&#xff1a;开发技术集合&#xff08;包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬…