iis服务器助手广告广告
返回顶部
首页 > 资讯 > 服务器 >如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件
  • 605
分享到

如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件

2024-04-02 19:04:59 605人浏览 独家记忆
摘要

这篇文章给大家分享的是有关如何使用nodejs搭建服务器访问html、CSS、js等静态资源文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。第一步,俗话说的好,工欲善其事,必先

这篇文章给大家分享的是有关如何使用nodejs搭建服务器访问htmlCSSjs等静态资源文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

第一步,俗话说的好,工欲善其事,必先利其器。既然要用node+express配置服务器,如果电脑上没有的话自然要先安装这两个大宝贝啦。

1.安装node。到Node官网下载安装即可,直接下一步下一步就完成了。

2.npm初始化项目。打开终端,输入npm init -y即可。注意:如果不输入-y要自己写一些配置,写了-y会默认直接生成一个package.JSON文件。

3.安装Express。在终端输入 npm i S express回车即可

第二步,编写Express配置文件。新建一个app.js文件(文件名可随意,但不要使用关键字)

var express = require('express');
var path = require('path');
var app = express();

[color=#ff0000]app.use(express.static(path.join(__dirname, 'public')));[/color]

app.listen(4444, function() {
 console.log('App listening at port 8080;');
});

其中最主要的部分是app.use(express.static(path.join(__dirname, 'public')))  ,该行代码是在express添加中间件,设置静态资源路径为public,所有的HTML、CSS、JS等文件都放在public下即可

第三步,在public文件夹中添加测试页面。我这里写的是一个命名为changeColor.html的页面。当它显示在手机上时,手机横、竖屏变化,body显示不同的背景颜色。

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>testExpress</title>
 <style type="text/css">
 body{background-color: yellow;}
 @media screen and (orientation:landscape){
  body{background-color: orange;}
 }
 </style>
</head>
<body>
</body>
</html>

第四步,添加完后,启动服务。

我这里用的是sublime,按两个ctrl+r,如果控制台输出App listening at port 4444;表示启动服务成功。打开浏览器,在地址栏输入:Http://localhost/4444/changeColor.html

就可以查看测试网页了。如果把localhost换成本机的IP,替换后的地址就可以放在手机上显示了。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程网!

感谢各位的阅读!关于“如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: 如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件

本文链接: https://www.lsjlt.com/news/73121.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件
    这篇文章给大家分享的是有关如何使用Nodejs搭建服务器访问html、css、JS等静态资源文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。第一步,俗话说的好,工欲善其事,必先...
    99+
    2024-04-02
  • SpringBoot如何访问html和js等静态资源配置
    目录SpringBoot访问html和js等静态资源配置1:访问html2:访问jsSpringBoot访问不到js,css等静态资源问题SpringBoot访问html和js等静态...
    99+
    2024-04-02
  • Tomcat无法加载css和js等静态资源文件如何解决
    这篇文章主要讲解了“Tomcat无法加载css和js等静态资源文件如何解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Tomcat无法加载css和js等静态资源文件如何解决”吧!解决思路有...
    99+
    2023-07-04
  • 如何使用node搭建静态资源管理器
    这篇文章将为大家详细讲解有关如何使用node搭建静态资源管理器,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。具体如下:我么都知道,老牌的3p服务器都是自带静态资源管理器的...
    99+
    2024-04-02
  • nodejs如何搭建本地服务器并访问文件
    小编给大家分享一下nodejs如何搭建本地服务器并访问文件,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!安装node:https...
    99+
    2024-04-02
  • 如何使用nodeJS搭建本地文件服务器
    这篇文章主要介绍了如何使用nodeJS搭建本地文件服务器,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。搭建nodejs服务器步骤:1.安装n...
    99+
    2024-04-02
  • 如何使用Node.js实现一个静态资源服务器
    今天就跟大家聊聊有关如何使用Node.js实现一个静态资源服务器,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。项目涉及...
    99+
    2024-04-02
  • 如何使用Nginx搭建详细的静态文件服务器【经典】
    Nginx是一种强大的Web服务器,可以用于托管静态文件。本文将详细介绍如何使用Nginx搭建一个静态文件服务器,使您能够轻松地浏览目录、导航子目录和文件,并通过浏览器下载文件。 以下是使用Nginx...
    99+
    2023-10-06
    nginx java
  • 如何使用Node.js搭建一个静态Web服务器
    这篇文章主要介绍了如何使用Node.js搭建一个静态Web服务器的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇如何使用Node.js搭建一个静态Web服务器文章都会有所收获,下...
    99+
    2024-04-02
  • 如何使用Node写静态文件服务器
    目录背景功能介绍代码实现基础代码实现大文件优化Stream减少文件传输带宽使用浏览器缓存什么是Etag总结背景 作为前端工程师,我想大家一定对静态文件服务器不会陌生。所谓的静态文件服...
    99+
    2024-04-02
  • 如何搭建云服务器网页访问记录文件
    以下是一篇800字的文章,介绍如何通过记录网页访问记录文件来搭建安全的云服务器网页。 首先,我们需要在本地建立一个数据库文件,用于存储网页访问记录。在Windows系统中,可以使用文本编辑器或者命令行工具创建一个名为"database"的...
    99+
    2023-10-27
    服务器 网页 文件
  • 如何进行Nginx静态文件服务器搭建及autoindex模块解析
    这期内容当中小编将会给大家带来有关如何进行Nginx静态文件服务器搭建及autoindex模块解析,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。ngx_http_autoindex_modulengx_h...
    99+
    2023-06-28
  • 如何搭建云服务器网页访问记录文件夹
    首先,你需要选择一种网络技术来构建云服务器网络,比如NAT网关、负载均衡器等。这些技术可以让你的云服务器拥有多个网络连接,从而支持多个用户的访问。 然后,你需要为云服务器添加一个访问记录文件夹,这个文件夹通常被放在应用程序的后端。用户在访...
    99+
    2023-10-27
    文件夹 服务器 网页
  • 如何使用 Chi 路由器提供静态文件夹服务
    php小编苹果为您介绍如何使用Chi路由器提供静态文件夹服务。Chi是一个轻量级的Go语言Web框架,它提供了简洁、高效的路由功能。通过Chi,我们可以轻松地搭建一个静态文件夹服务,将...
    99+
    2024-02-09
    go语言
  • Ubuntu如何使用nginx搭建webdav文件服务器
    这篇文章将为大家详细讲解有关Ubuntu如何使用nginx搭建webdav文件服务器,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。安装nginx注意必须安装nginx-full, 默认的nginx里面并不...
    99+
    2023-06-15
  • 如何使用 docker compose 搭建 fastDFS文件服务器
    上篇文章给大家介绍了使用docker compose安装FastDfs文件服务器的实例详解 今天给大家介绍如何使用 docker compose 搭建 fastDFS文件服务器,内容...
    99+
    2024-04-02
  • 详解如何使用Nginx搭建文件服务器及实现文件服务
    前言 公司最近有做文件服务器的需求,并且使用到了Nginx做负载均衡服务器,顺水推舟,就想着顺便用作文件服务器算了,实际上它也非常适合。 Nginx是一种轻巧、高效的Web服务器,用作文件服务器非常合适。但是如果需要一些高级功能,如FTP远...
    99+
    2023-09-08
    nginx java springboot 服务器 linux
  • 如何使用阿里云服务器搭建FTP服务器并配置文件
    本文将介绍如何使用阿里云服务器搭建FTP服务器,并配置文件。FTP(File TransferProtocol)是一种常用的文件传输协议,可以让用户在不直接进行文件交换的情况下,通过互联网上传、下载文件。 步骤一:创建阿里云服务器首先,你需...
    99+
    2023-12-13
    服务器 阿里 如何使用
  • 使用windows service 2012云服务器搭建mysql时缺少msvcr100.dll文件如何解决
    使用windows service 2012云服务器搭建mysql时缺少msvcr100.dll文件如何解决?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。解决方...
    99+
    2023-06-06
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作