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

为了测一个附近门店的功能,需要配置一下服务器进行测试。本来打算用apache的,后来想自己是做前端的,好久没有用过Nodejs了何不用所学的知识自己配一下呢,说动手就手。

第一步,俗话说的好,工欲善其事,必先利其器。既然要用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,替换后的地址就可以放在手机上显示了。

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

(0)

相关推荐

  • 3分钟快速搭建nodejs本地服务器方法运行测试html/js

    做前端的都知道,公司的项目在自己的电脑上搭建环境是挺麻烦的一件事情 首先:一般个人电脑没公司的配置性能好, 其次:搭建公司项目在自己电脑涉及很多缓存环境,资源环境包,数据库等的限制,加起来够搞一天了(熟悉公司搭建的环境除外) 就我自身公司而言情况是这样,我作为前端工程师, 前端目前是基于polymer--实现最近遇到的问题就是不知道自己写的页面有没有什么问题,但是要成功启动项目的tomcat才能看,因为这些页面无法直接打开,会包资源解析错误, 于是我在想,如何才能把前端页面不依赖tomcat这些

  • 用nodejs的实现原理和搭建服务器(动态)

    今天是我学习的Node.js的第二天,所谓的node.js其实它是javascript编写的服务器的语言,同时它又是属于后台的框架,是一个开放性的平台. 一.相关理论知识: 我们可以用requre来引入模块.用module.exprorts来导出模块. 安装nodejs和配置npm 1.安装nodejs,安装完后在cmd命令行中敲入node -v,查看版本. 2.在cmd中敲入npm config list查看是否安装npm. 3.设置镜像地址. 淘宝镜像:在命令行中敲入npm config s

  • 用nodejs搭建websocket服务器

    简单开始 1.安装node.https://nodejs.org/en/ 2.安装ws模块 ws:是nodejs的一个WebSocket库,可以用来创建服务. https://github.com/websockets/ws 3.server.js 在项目里面新建一个server.js,创建服务,指定8181端口,将收到的消息log出来. var WebSocketServer = require('ws').Server, wss = new WebSocketServer({ port: 8

  • NodeJS基础API搭建服务器详细过程记录

    前言 在习惯了使用express框架,jade模板引擎等现成工具来写代码之后,很多人对于基本的NodeJS API会慢慢生疏.本文将以一个超小型web项目,来详细介绍如何使用NodeJS基础的http, fs, path, url等模块提供的API来搭建一个简单的web服务器.当做对NodeJS的一次复习,也为初学NodeJS的开发者提供一个参考.本文所搭建的项目将不会使用express等后端框架,仅使用最基础的NodeJS API,按照MVC设计模式的思路进行编码和讲解,交流意见.源代码地址如

  • 用nodeJS搭建本地文件服务器的几种方法小结

    搭建nodejs服务器步骤: 1.安装nodejs服务,node相当于apache服务器 2.在自己定义的目录下新建服务器文件如 server.js 例如,我在E:\PhpProject\HTML5\websocket下创建了server.js文件 var http = require('http');//引入http模块 //开启服务,监听8888端口 //端口号最好为6000以上 var server = http.createServer(function(req,res){ /* req

  • Nodejs 搭建简单的Web服务器详解及实例

    使用 Nodejs 搭建简单的Web服务器 使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块.路径解析模块.以及301重定向问题,下面我们就简单讲一下如何来搭建一个简单的Web服务器. 作为一个Web服务器应具备以下几个功能: 1.能显示以.html/.htm结尾的Web页面 2.能直接打开以.js/.css/.json/.text结尾的文件内容

  • Nodejs如何搭建Web服务器

    使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块.路径解析模块.以及301重定向问题,下面我们就简单讲一下如何来搭建一个简单的Web服务器. 作为一个Web服务器应具备以下几个功能: 1.能显示以.html/.htm结尾的Web页面 2.能直接打开以.js/.css/.json/.text结尾的文件内容 3.显示图片资源 4.自动下载以.apk/.

  • 在windows上用nodejs搭建静态文件服务器的简单方法

    在windows上用nodejs搭建一个静态文件服务器,即使你一点基础没有也能学会nodejs静态文件服务器的搭建,本文介绍的非常详细,很适合零基础入门的朋友学习. 首先安装nodejs: •新建一个node文件夹 •下载node.exe到该文件夹 •下载npm然后解压到该文件夹 •现在node文件夹是这样的 •把该目录加入到path环境变量 •在命令行执行 node -v npm -v 如果得到了版本号则表示nodejs安装完成 •在命令行中执行 npm config set registry

  • nodejs搭建本地服务器并访问文件的方法

    安装node:https://nodejs.org/en/download/ 在本地建立目录:f:/nodetest,在该目录下新建index.html作为我们将要访问的内容.新建server.js作为node开启的入口: $ cd f:/nodetest $ mkdir index.html $ mkdir server.js index.html文件里简单写一点东西: <!DOCTYPE html> <html lang="en"> <head>

  • 搭建简单的nodejs http服务器详解

    搭建简单的nodejs服务器 通过一些简单配置我们就可以搭建一台基于nodejs的http服务器 通过switch配置url路由的方法 // 这是一个简单的Node HTTP服务器,能处理当前目录的文件 // 并能实现两种特殊的URL用于测试 // 用HTTP://localhost:8000或http://127.0.0.1:8000连接这个服务器 // 首先加载所有需要用到的模块 var http = require('http'); // 加载http服务api模块 var fs = re

  • iPhone手机上搭建nodejs服务器步骤方法

    一.为在ios上面运行,编译jxcore 复制代码 代码如下: $ mkdir ~/jxcore  $ cd ~/jxcore  $ git clone https://github.com/jxcore/jxcore.git 复制代码 代码如下: $ cd ~/jxcore/jxcore  $ ./build_scripts/ios-compile.sh 如果出现import which的module not found问题, 那就通过下面语句安装python的which 复制代码 代码如下:

随机推荐