位置: 编程技术 - 正文

详解Nodejs之静态资源处理(nodejs 静态页面)

编辑:rootadmin

推荐整理分享详解Nodejs之静态资源处理(nodejs 静态页面),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:nodejs静态编译,nodejs生成静态html,node.js静态服务器,node 静态网页,nodejs生成静态html,nodejs生成静态html,nodejs 静态页面,node.js静态服务器,内容如对您有帮助,希望把文章链接给更多的朋友!

前言

刚开始用Nodejs写简单的web服务器的时候,总是感觉少了点什么。

原来,我一直是在页面上输出什么Hello World!啊, It Works.之类的了。还确实没有处理关于CSS, JS这些引用的静态相关的资源。

一开始觉得处理这些东西应该会非常的easy,结果发现不仅仅是这么回事。途中也遇到了一些人们经常可能会犯的想当然的错误。于是我就决定好好的记录一下关于Nodejs中对于静态资源的处理。

着眼于问题

重现问题

先来展示一下目录结构吧。

这样一个web项目的骨架就算是搭建好了。下面简单的使用nodejs的http模块实现一个web服务器。目标就是显示index.html

index.html

index.css

server.js

代码中用到了一个名为__dirname的变量,其值就是当前运行文件的绝对路径。通过它,我们可以组装出我们想要获取的文件的全路径。

运行代码,开启服务器。

发现问题

然后我们打开浏览器,会发现这样的景象。

没有任何效果的页面

不仅是CSS样式没显示出来,就连图片也同样没有正确显示。

然后我们打开浏览器控制台,会发现客户端向服务器发送了3次请求,分别是:

客户端请求内容

localhost: HTML代码页 index.css: 样式文件 1.gif: 图片文件

之所以我们没能看到具体的效果,就是因为服务器没有正确返回相关的内容啊。这样一想,一下子就恍然大悟了。所以这颗Silver Bullet就是

详解Nodejs之静态资源处理(nodejs 静态页面)

针对每一个不同的资源请求,正确的返回相关的内容。

解决问题

我的思路:

剖析request请求地址。分割出文件名,后缀名。 根据后缀补全相关文件在文件系统中的全路径。 根据全路径读取内容,返回给客户端。

server.js

然后简单的修改了一下server.js,当然这里也只是简单的做下示意,生产代码可千万不要这么写。

然后重启服务器。

再次访问浏览器

因为没有录屏,所以没体现出GIF图的效果,不过关于静态资源已经足够显示了。

express

还有一个比较好用的web框架,express,其对于静态资源的支持更加方便。属于一个更加高层的封装。

核心

通过express对象的app.use(express.static(folder_path))方法就可以了。方法的参数指定为相关的静态资源文件夹路径即可。

server-express.js

index.html

因为刚才使用了静态资源控制,也就是说我们可以简化HTML页面中对于静态资源的路径拼写。比如:

原来在HTML页面中要这么写:

现在只需要这么写了:

看起来就是少了个 /public, 但是实际上通过这一点就可以表明express 其实帮我们省去了很多枯燥的工作内容。

然后打开浏览器就可以看到具体的静态资源内容了。

那么对于不同的图片类型的支持程度如何呢?

下面修改一下HTML页面:

打开浏览器查看对于gif, png, jpg的支持如何?

标签: nodejs 静态页面

本文链接地址:https://www.jiuchutong.com/biancheng/380835.html 转载请保留说明!

上一篇:Node.js开发第三方微信公众平台(node.js web开发)

下一篇:Node.js连接mongodb实例代码(node.js连接mysql数据库的方法有哪些)

  • 所得税汇算清缴报告在哪查
  • 北京增值税发票查验平台
  • 计提应交个人所得税分录怎么做
  • 支付的运输费用计入什么科目
  • 汇算清缴期间发生的计入当期损益吗
  • 工业土地摊销年限最新规定
  • 足浴店装修费用多少
  • 文化传媒公司开票税点
  • 用票据付款怎么做账
  • 固定资产清理时残值怎么处理
  • 外包和离岸外包一样吗
  • 其他权益投资公允价值变动怎么计量
  • 企业股权转让影响利润吗
  • 机动车销售发票可以跨年抵扣吗
  • 税后利润补亏的会计分录怎么做
  • 转让财产收入计入哪个科目
  • 所得税汇算期间费用填列说明
  • 开票商品名称是什么意思
  • 多开了一张电子发票怎么办
  • 企业减免税会计分录
  • 建筑施工企业清欠管理办法
  • 大中小微企业划分标准2023年
  • 2月发1月工资个税怎么算
  • 小规模纳税人印花税怎样计算
  • 研发过程中材料费计入
  • win11有哪些提升
  • 不用itunes怎么下载软件
  • 进程控制块PCB不包括( )
  • 未能连接到一个windows 的服务win7
  • Fort Rock Valley Historical Homestead博物馆,俄勒冈 (© Prisma by Dukas Presseagentur GmbH/Alamy)
  • 文竹怎么养才能更旺盛浇点醋
  • 贷款和应收款项应采用实际利率法
  • windows安装无法继续,若要安装请重新启动
  • 收到投资款投资人怎么感谢
  • 深入理解计算机系统 第三版 pdf
  • 土地款什么时候进在建工程
  • 待摊费用在资产负债表中怎么表示
  • 所得税季度申报表怎么填
  • 对公账号里面的钱会扣税吗
  • 运营费的税率
  • 结转生产成本是负数怎么办
  • 非居民纳税人工资个人所得税税率
  • 所有者权益变动表模板excel
  • 公司收到银行存款利息回单的会计分录
  • 瀑布流样式
  • python异常值处理方法
  • 小规模劳务派遣公司税率
  • 入库材料计入什么科目
  • 税控盘每年的服务费可以全额抵扣吗
  • sql2012存储过程
  • sql2005安装步骤
  • 结转损益结转了两次咋办
  • 将外购商品作为非货币
  • 支付给烟农的价格怎么算
  • 销售方开红字发票需要什么信息
  • 发票缴销了还能恢复吗
  • 财务费用怎么计入现金流量表
  • 房产税什么时候开始征收2023
  • 什么叫归集和分配
  • 在SQL Server中使用存储过程的优点包括
  • c3p0连接池提供了哪些方式来配置连接池的参数
  • win10新预览版
  • 硬盘安装在机箱内,属于主机的组成部分
  • freebsd版本选择
  • xp注册表损坏怎么修复
  • hadoop开发环境linux集群的安装步骤
  • ubuntu开机密码不记得了
  • snmptrap.exe - snmptrap是什么进程 有什么作用
  • win7暗藏的超实用快捷键汇总
  • windows8内存
  • win8的计算机在哪里
  • linux的含义
  • 微软win8.1
  • win8设备管理器没有端口
  • unity一运行就停止工作
  • JQuery datepicker 用法详解
  • 举例详解民法典第994条
  • nodejs如何实现数据库
  • 那些so 叼的android studio 插件
  • 汉中税务大厅电话是多少
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设