返回顶部
首页 > 资讯 > 服务器 >如何使用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://lsjlt.com/news/73121.html(转载时请注明来源链接)

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

猜你喜欢
  • 用Nodejs搭建服务器访问html、css、JS等静态资源文件
    为了测一个附近门店的功能,需要配置一下服务器进行测试。本来打算用apache的,后来想自己是做前端的,好久没有用过Nodejs了何不用所学的知识自己配一下呢,说动手就手。 第一步,俗话说的好,工欲善其事,必...
    99+
    2022-06-04
    静态 服务器 文件
  • 如何使用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
  • nodejs构建本地web测试服务器 如何解决访问静态资源问题
    直接打开html文件,是以file:///方式打开的,这种方式很多时候会遇到跨域的问题,因此我们一般会搭建一个简易的本地服务器,来运行测试页面。 一、构建静态服务器 1、使用express模块 建立个js文...
    99+
    2022-06-04
    如何解决 静态 服务器
  • 如何使用node搭建静态资源管理器
    这篇文章将为大家详细讲解有关如何使用node搭建静态资源管理器,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。具体如下:我么都知道,老牌的3p服务器都是自带静态资源管理器的...
    99+
    2024-04-02
  • nodejs如何搭建本地服务器并访问文件
    小编给大家分享一下nodejs如何搭建本地服务器并访问文件,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!安装node:https...
    99+
    2024-04-02
  • linux服务器上使用nginx访问本地静态资源的方法
    1.查看80端口是否被占用,一般80端口多被apache服务占用。 netstat -anp|grep 80   2.修改apache服务的端口号 vim /etc/apache2/ports.conf 3.将端口号...
    99+
    2022-06-04
    linux服务器 nginx本地静态资源 nginx 静态资源
  • 如何使用nodeJS搭建本地文件服务器
    这篇文章主要介绍了如何使用nodeJS搭建本地文件服务器,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。搭建nodejs服务器步骤:1.安装n...
    99+
    2024-04-02
  • 在windows上用nodejs搭建静态文件服务器的简单方法
    在windows上用nodejs搭建一个静态文件服务器,即使你一点基础没有也能学会nodejs静态文件服务器的搭建,本文介绍的非常详细,很适合零基础入门的朋友学习。 首先安装nodejs: •...
    99+
    2022-06-04
    静态 简单 文件服务器
  • 如何使用Nginx搭建详细的静态文件服务器【经典】
    Nginx是一种强大的Web服务器,可以用于托管静态文件。本文将详细介绍如何使用Nginx搭建一个静态文件服务器,使您能够轻松地浏览目录、导航子目录和文件,并通过浏览器下载文件。 以下是使用Nginx...
    99+
    2023-10-06
    nginx java
  • 如何使用Node.js实现一个静态资源服务器
    今天就跟大家聊聊有关如何使用Node.js实现一个静态资源服务器,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。项目涉及...
    99+
    2024-04-02
  • 如何使用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
    服务器 网页 文件
  • 如何搭建云服务器网页访问记录文件夹
    首先,你需要选择一种网络技术来构建云服务器网络,比如NAT网关、负载均衡器等。这些技术可以让你的云服务器拥有多个网络连接,从而支持多个用户的访问。 然后,你需要为云服务器添加一个访问记录文件夹,这个文件夹通常被放在应用程序的后端。用户在访...
    99+
    2023-10-27
    文件夹 服务器 网页
  • 如何进行Nginx静态文件服务器搭建及autoindex模块解析
    这期内容当中小编将会给大家带来有关如何进行Nginx静态文件服务器搭建及autoindex模块解析,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。ngx_http_autoindex_modulengx_h...
    99+
    2023-06-28
  • 如何使用 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
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作