node.js实现静态资源加载的方法——两种方法http及express

一.使用内置http实现静态资源加载

原生node要实现静态资源加载就需要借助其内置模块"fs"中的方法去读取静态资源,然后用response中的方法响应给用户

1.需要用到的模块

javascript 复制代码
const http = require('http');
const fs = require('fs');
const path = require('path');

2.加载静态资源

一个简单的示例代码

javascript 复制代码
fs.readFile('./static/msg.txt', function (err, data) {
            if (err) {
                console.log('留言板读取失败!!!')
            }
            response。end(data)
        })

二.使用express库实现静态资源加载

这里可以直接用static中间件---

1.首先,需要安装express库:

安装密令:npm install express

2.示例代码帮助理解

javascript 复制代码
// static中间件用于托管静态文件。
// 通过使用express.static中间件函数,可以指定从哪个目录提供静态资源,如图片、CSS和JavaScript文件。
const express = require('express')
// 创建服务器
var app = express();
// 使用static中间件
app.use(express.static(__dirname + '/public'))
app.use(function(request,response){
    // 响应信息
    response.writeHead(200, { 'Content-Type': 'text/html' })
    response.end('<img src="/demo01.jpg" width = "100%" />')
});
// 启动服务器
app.listen(52273,function(){
    console.log('服务器监听地址 http://127.0.0.1:52273');
})
相关推荐
嘿嘿-664 小时前
Cherry Studio 接入ChatGpt:GPT-5.6 Sol 文本测试与 GPT-Image-2 出图教程
人工智能·gpt·ai·chatgpt·node.js·ai编程
大牧师4 小时前
TypeORM 学习教程
数据库·sql·学习·node.js·orm·nest.js·typeorm
逻辑05 小时前
安装 Claude Code 完整指南(用户级 Node.js 环境)
node.js·claude code
Wang's Blog6 小时前
Vibe Coding一人即团队系列54:云服务器 Node.js 与 MySQL 9 环境搭建及配置指南
服务器·人工智能·mysql·node.js
FungLeo6 小时前
成为全栈·Node 后端篇·结构化日志与请求链路追踪
node.js·结构化日志·成为全栈·请求链路
Flynt10 小时前
NestJS 12升级踩坑:从Webpack到Rspack,我折腾了一整个周末
typescript·node.js·nestjs
FungLeo1 天前
成为全栈·Node 后端篇·配置管理:环境变量、多环境与密钥安全
node.js·环境变量·多环境配置·密钥安全
FungLeo1 天前
成为全栈·Node 后端篇·错误处理:异常分层与全局捕获
node.js·错误处理·异常分层·全局捕获·成为全栈
百万运营Pro1 天前
用 Astro + Supabase 从零构建全网盘聚合搜索引擎:PGroonga 中文检索实战
搜索引擎·前端框架·node.js·个人开发·学习方法·ai编程·资源分享
__zRainy__1 天前
Node系列 · Express:cors 中间件
中间件·express