【Express】服务端渲染(模板引擎 EJS)

EJS(Embedded JavaScript)是一款流行的模板引擎,可以用于在Express中创建动态的HTML页面。它允许在HTML模板中嵌入JavaScript代码,并且能够生成基于数据的动态内容。
下面是一个详细的讲解和示例,演示如何在Express中使用EJS模板引擎:
- 安装EJS:首先,在你的项目中安装EJS模板引擎。可以使用NPM来完成安装:
npm install ejs
- 配置EJS:在Express应用中,你需要设置EJS作为模板引擎。在app.js(或其他入口文件)中添加以下代码:
const express = require('express');
const app = express();
app.set('views', './views'); // views, 放模板文件的目录
app.set('view engine', 'ejs');
-
创建EJS视图文件:在项目目录下创建一个名为
views的文件夹(如果没有的话),然后在该文件夹中创建一个EJS视图文件,比如index.ejs。 -
使用EJS模板:在路由处理程序中,使用
res.render()方法来渲染EJS视图文件,并传递数据给模板。以下是一个例子:
app.get('/', (req, res) => {const data = {name: 'John',age: 25,hobbies: ['reading', 'running', 'cooking']};res.render('index', { data });
});
在上面的示例中,当用户访问根URL时,将渲染名为index.ejs的视图文件,并提供名为data的数据对象。
- 在EJS模板中使用数据:在
index.ejs视图文件中,可以通过以下方式使用传递的数据:
<h1>Welcome, <%= data.name %>!</h1>
<p>Age: <%= data.age %></p>
<p>Hobbies:</p>
<ul><% data.hobbies.forEach((hobby) => { %><li><%= hobby %></li><% }) %>
</ul>
在EJS模板中,用<%= %>插入JavaScript表达式来显示数据。使用<% %>标记包裹一段JavaScript代码,可以进行循环、条件判断和其他逻辑操作。

- 渲染完整的HTML页面:在
index.ejs文件中,可以使用partials(局部视图)和其他EJS功能来构建完整的HTML页面。
EJS还支持其他功能,比如模板继承、自定义过滤器等。
相关文章:
【Express】服务端渲染(模板引擎 EJS)
EJS(Embedded JavaScript)是一款流行的模板引擎,可以用于在Express中创建动态的HTML页面。它允许在HTML模板中嵌入JavaScript代码,并且能够生成基于数据的动态内容。 下面是一个详细的讲解和示例,演示如何在Express中…...
Linux CentOS8安装gitlab_ce步骤
1 下载安装包 wget --content-disposition https://packages.gitlab.com/gitlab/gitlab-ce/packages/el/8/gitlab-ce-15.0.2-ce.0.el8.x86_64.rpm/download.rpm2 安装gitlab yum install policycoreutils-python-utilsrpm -Uvh gitlab-ce-15.0.2-ce.0.el8.x86_64.rpm3 更新配…...
RabbitMq启用TLS
Windows环境 查看配置文件的位置 选择使用的节点 查看当前节点配置文件的配置 配置TLS 将证书放到同配置相同目录中 编辑配置文件添加TLS相关配置 [{ssl, [{versions, [tlsv1.2]}]},{rabbit, [{ssl_listeners, [5671]},{ssl_options, [{cacertfile,"C:/Users/17126…...
CakePHP 3.x/4.x反序列化RCE链
最近网上公开了cakephp一些反序列化链的细节,但是没有公开poc,并且网上关于cakephp的反序列化链比较少,于是自己跟一下 ,构造pop链。 CakePHP简介 CakePHP是一个运用了诸如ActiveRecord、Association Data Mapping、Front Contr…...
练习之C++[3]
文章目录 1.模板类2.模板声明3.string类 1.模板类 模板可以具有非类型参数,用于指定大小,可以根据指定的大小创建动态结构所以可用来创建动态增长和减小的数据结构模板运行时不检查数据类型,也不保证类型安全,相当于类型的宏替换…...
[MT8766][Android12] 修改WIFI热点默认名称、密码、IP地址以及默认开启热点
文章目录 开发平台基本信息问题描述解决方法 开发平台基本信息 芯片: MTK8766 版本: Android 12 kernel: msm-4.19 问题描述 最近做了一款没有屏幕显示的智能盒子,要想操控这款设备就只能通过adb投屏,如果默认不允许有线连接,那么要怎么实…...
【嵌入式】堆栈与单片机内存
堆栈 在片内RAM中,常常要指定一个专门的区域来存放某些特别的数据 它遵循顺序存取和后进先出(LIFO/FILO)的原则,这个RAM区叫堆栈。 其实堆栈就是单片机中的一些存储单元,这些存储单元被指定保存一些特殊信息,比如地址࿰…...
十大排序算法Java实现及时间复杂度
文章目录 十大排序算法选择排序冒泡排序插入排序希尔排序快速排序归并排序堆排序计数排序基数排序桶排序时间复杂度 参考资料 十大排序算法 选择排序 原理 从待排序的数据元素中找出最小或最大的一个元素,存放在序列的起始位置, 然后再从剩余的未排序元…...
[Go]配置国内镜像源
配置 Windows 选一个 go env -w GOPROXYhttps://goproxy.cn,direct go env -w GOPROXYhttps://mirrors.aliyun.com/goproxy,direct查看环境配置 go env...
Java知识点补充
静态方法 vs 实例方法: 静态方法(使用 static 关键字声明):属于类,不依赖于对象实例,可以通过类名直接调用。 实例方法(不使用 static 关键字声明):属于类的实例…...
Webpack和JShaman相比有什么不同?
Webpack和JShaman相比有什么不同? Webpack的功能是打包,可以将多个JS文件打包成一个JS文件。 JShaman专门用于对JS代码混淆加密,目的是让JavaScript代码变的不可读、混淆功能逻辑、加密代码中的隐秘数据或字符,是用于代码保护的…...
WEB应用程序编程接口API
使用Web API Web API是网站的一部分,用于与使用具体URL请求特定信息的程序交互。这种请求称为API调用。请求的数据格式以易于处理的格式(JSON,CSV)返回。 Git和GitHub Git是一个分布式版本控制系统,帮助人们管理为项目所做的工作…...
进阶JAVA篇- BigDecimal 类的常用API(四)
目录 API 1.0 BigDecimal 类说明 1.1 为什么浮点数会计算不精确呢? 1.2 如何创建 BigDecimal 类型的对象 1.2.1具体来介绍三种方式来创建: 1.2.2 结合三种创建方法,一起来分析一下。 1.3 BigDecimal 类中的 valueOf(Strin…...
UE4 顶点网格动画播放后渲染模糊问题
问题描述:ABC格式的顶点网格动画播放结束后,改模型看起来显得很模糊有抖动的样子 解决办法:关闭逐骨骼动态模糊...
centos 磁盘挂载与解挂
磁盘挂载 查看已挂载的磁盘 df -TH查看磁盘分区,对比第一步,看哪些磁盘没有挂载,例如发现/dev/sdb的磁盘没有在第一步中显示 fdisk -l磁盘分区(/dev/sdb为上一步骤中没有挂载的磁盘) fdisk /dev/sdb执行上一命令后…...
C语言 位操作
定义 位操作提高程序运行效率,减少除法和取模的运算。在计算机程序中,数据的位是可以操作的最小数据单位,理论上可以用“位运算”来完成所有的运算和操作。 左移 后空缺自动补0 右移 分为逻辑右移和算数右移 逻辑右移 不管什么类型&am…...
Go语言中入门Hello World以及IDE介绍
您可以阅读Golang教程第1部分:Go语言介绍与安装 来了解什么是golang以及如何安装golang。 Go语言已经安装好了,当你开始学习Go语言时,编写一个"Hello, World!"程序是一个很好的入门点。 下面将会提供了一些有关IDE和在线编辑器的…...
Java面试题-Java核心基础-第二天(基本语法)
目录 一、注释有几种形式 二、标识符与关键字的区别 三、自增自减运算符 四、移位运算符 五、continue、break、return的区别 一、注释有几种形式 注释除了有其他编程语言有的单行注释和多行注释之外,还有其Java特有的文档注释 文档注释能够使用javadoc命令就…...
Linux 部署 GitLab idea 连接
概述 GitLab 是一个开源的代码管理平台,使用 Git 作为版本控制工具,提供了 Web 界面和多种功能,如 wiki、issue 跟踪、CI/CD 等。 GitLab 可以自托管或使用 SaaS 服务,支持多种操作系统和执行器。 GitLab 可以帮助软件开发团队…...
Java延迟队列——DelayQueue
Java延迟队列——DelayQueue DelayQueue的定义 public class DelayQueue<E extends Delayed> extends AbstractQueue<E> implements BlockingQueue<E>DelayQueue是一个无界的BlockingQueue,是线程安全的(无界指的是队列的元素数量不存…...
Chiplet技术与全相干扩展架构解析
1. Chiplet技术概述与全相干扩展架构在现代计算架构中,Chiplet技术正在彻底改变传统单片SoC的设计范式。这种模块化设计方法允许将不同功能单元分解为独立的硅片,通过先进封装技术互连。全相干扩展(远程翻译)Chiplet作为其中的关键…...
3分钟掌握APK Installer:在Windows电脑上轻松安装安卓应用的终极方案
3分钟掌握APK Installer:在Windows电脑上轻松安装安卓应用的终极方案 【免费下载链接】APK-Installer An Android Application Installer for Windows 项目地址: https://gitcode.com/GitHub_Trending/ap/APK-Installer 你是否曾想在Windows电脑上直接运行An…...
基于MCP协议构建AI工具服务器:连接Web与AI的标准化适配器
1. 项目概述:一个连接Web与AI的“万能适配器”如果你正在尝试让AI助手(比如ChatGPT、Claude)去访问一个网站、查询实时天气、或者控制你的智能家居,你可能会发现一个核心难题:这些大模型本身是“离线”的,它…...
思源宋体TTF终极指南:免费获取7种字重的完整解决方案
思源宋体TTF终极指南:免费获取7种字重的完整解决方案 【免费下载链接】source-han-serif-ttf Source Han Serif TTF 项目地址: https://gitcode.com/gh_mirrors/so/source-han-serif-ttf 还在为中文设计项目寻找既专业又完全免费的高质量字体吗?思…...
API Key认证系统设计:企业级API开放平台实践
API Key认证系统设计:企业级API开放平台实践 摘要:当AI应用从内部工具转向对外开放时,如何确保接口安全、防止滥用并实现精细化权限控制?本文基于一个真实的跑步教练AI项目,详细解析如何构建一套生产级的API Key认证系…...
mRNA疫苗序列生物信息学分析:从密码子优化到免疫原性预测
1. 项目概述:解码两大mRNA疫苗的“核心蓝图”作为一名在生物信息学和基因组学领域摸爬滚打了十多年的“老码农”,我见过太多令人兴奋的数据集,但当我第一次在GitHub上看到这个名为“Assemblies-of-putative-SARS-CoV2-spike-encoding-mRNA-se…...
GEO优化实操框架:GEO优化的正确姿势是“带着答案去找客户”
如果你是B2B企业的老板或市场负责人,你一定听过这句话: “我们网上曝光是不少,但来的询盘都不对——问价格的比问方案的还多,还有不少是学生做调研的。” 这不是你一个人遇到的问题。这是传统SEO和竞价广告的天然缺陷——你只能“…...
猫抓插件:5分钟掌握浏览器资源嗅探的终极武器
猫抓插件:5分钟掌握浏览器资源嗅探的终极武器 【免费下载链接】cat-catch 猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension 项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch 在数字内容无处不在的今天,你…...
用51单片机和HC-SR04超声波模块DIY一个倒车雷达(附完整代码和立创EDA原理图)
51单片机与HC-SR04超声波模块实战:打造高精度倒车雷达系统 在汽车电子和智能硬件领域,倒车雷达作为基础安全装置,其DIY实现不仅能帮助理解超声波测距原理,更是掌握嵌入式系统开发的绝佳实践。本文将手把手教你使用经典的STC89C52单…...
Apex Legends进阶指南:结构化训练框架与技能模块化拆解
1. 项目概述:一个面向Apex Legends玩家的成长型技能库如果你是一位《Apex Legends》的玩家,并且对提升自己的游戏水平有持续的热情,那么你很可能和我一样,经历过一个漫长的摸索期。从最初落地成盒,到逐渐熟悉地图、枪械…...
