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');
})
相关推荐
朝朝暮暮an19 小时前
Day 3|Node.js 异步模型 & Promise / async-await(Part 1)
node.js
梦帮科技1 天前
Node.js配置生成器CLI工具开发实战
前端·人工智能·windows·前端框架·node.js·json
Misnice1 天前
Webpack、Vite、Rsbuild区别
前端·webpack·node.js
毕设源码-朱学姐2 天前
【开题答辩全过程】以 基于Node.js的书籍分享平台设计与实现为例,包含答辩的问题和答案
node.js
前端 贾公子2 天前
Node.js 如何处理 ES6 模块
前端·node.js·es6
周杰伦的稻香2 天前
Hexo搭建教程
java·node.js
毕设源码-钟学长2 天前
【开题答辩全过程】以 基于node.js vue的点餐系统的设计与实现为例,包含答辩的问题和答案
前端·vue.js·node.js
朝朝暮暮an3 天前
Day 2|Node.js 运行机制、模块系统与异步初探
node.js
aidou13143 天前
Visual Studio Code(VS Code)安装步骤
vscode·npm·node.js·环境变量
止观止3 天前
告别 require!TypeScript 5.9 与 Node.js 20+ 的 ESM 互操作指南
javascript·typescript·node.js