昨天买了一个服务器想着用来测试一些自己的项目，由于是第一次建站，在tomcat,linux,node.js间想了好久。最终因为node搭建比较方便没那么麻烦就决定用node.js来搭建网站项目。

搭建服务器也很简单首先下载安装node.js后，建立一个项目文件夹再在文件夹下建一个js文件可任意取名，这个文件对项目进行配置

全部配置如下：

"use strict";

//加载所需要的模块

var http = require('http');

var url = require('url');

var fs = require('fs');

var path = require('path');

var cp = require('child_process');

//创建服务

var httpServer = http.createServer(processRequest);

// 这是端口号

var port = 80;

//指定一个监听的接口

httpServer.listen(port, function() {

    console.log(`app is running at port:${port}`);

    console.log(`url: http://localhost:${port}`);

    cp.exec(`explorer http://localhost:${port}`, function () {

    });

});

//响应请求的函数

function processRequest (request, response) {

    //mime类型

    var mime = {

        "css": "text/css",

        "gif": "image/gif",

        "html": "text/html",

        "ico": "image/x-icon",

        "jpeg": "image/jpeg",

        "jpg": "image/jpeg",

        "js": "text/javascript",

        "json": "application/json",

        "pdf": "application/pdf",

        "png": "image/png",

        "svg": "image/svg+xml",

        "swf": "application/x-shockwave-flash",

        "tiff": "image/tiff",

        "txt": "text/plain",

        "wav": "audio/x-wav",

        "wma": "audio/x-ms-wma",

        "wmv": "video/x-ms-wmv",

        "xml": "text/xml"

    };

    //request里面切出标识符字符串

    var requestUrl = request.url;

    //url模块的parse方法 接受一个字符串，返回一个url对象,切出来路径

    var pathName = url.parse(requestUrl).pathname;

    //对路径解码，防止中文乱码

    var pathName = decodeURI(pathName);

    //解决301重定向问题，如果pathname没以/结尾，并且没有扩展名

    if (!pathName.endsWith('/') && path.extname(pathName) === '') {

        pathName += '/';

        var redirect = "http://" + request.headers.host + pathName;

        response.writeHead(301, {

            location: redirect

        });

        //response.end方法用来回应完成后关闭本次对话，也可以写入HTTP回应的具体内容。

        response.end();

    }

    //获取资源文件的绝对路径

  /*  var filePath = path.resolve(__dirname + pathName);*/

   //__dirname是访问项目静态资源的路径 我的项目静态文件都在public下所以我写public可根据自己项目路径来配置哦

  var filePath = path.resolve("public" + pathName);

    console.log(filePath);

    //获取对应文件的文档类型

    //我们通过path.extname来获取文件的后缀名。由于extname返回值包含”.”，所以通过slice方法来剔除掉”.”，

    //对于没有后缀名的文件，我们一律认为是unknown。

    var ext = path.extname(pathName);

    ext = ext ? ext.slice(1) : 'unknown';

    //未知的类型一律用"text/plain"类型

    var contentType = mime[ext] || "text/plain";

    fs.stat(filePath, (err, stats) => {

        if (err) {

            response.writeHead(404, { "content-type": "text/html" });

            response.end("<h1>404</h1>");

        }

        //没出错 并且文件存在

        if (!err && stats.isFile()) {

            readFile(filePath, contentType);

        }

        //如果路径是目录

        if (!err && stats.isDirectory()) {

            var html = "<head><meta charset = 'utf-8'/></head><body><ul>";

            //读取该路径下文件

            fs.readdir(filePath, (err, files) => {

                if (err) {

                    console.log("读取路径失败！");

                } else {

                    //做成一个链接表，方便用户访问

                    var flag = false;

                    for (var file of files) {

                        //如果在目录下找到index.html，直接读取这个文件

                        if (file === "index.html") {

                            readFile(filePath + (filePath[filePath.length-1]=='/' ? '' : '/') + 'index.html', "text/html");

                            flag = true;

                            break;

                        };

                        html += `<li><a href='${file}'>${file}</a></li>`;

                    }

                    if(!flag) {

                        html += '</ul></body>';

                        response.writeHead(200, { "content-type": "text/html" });

                        response.end(html);

                    }

                }

            });

        }

        //读取文件的函数

        function readFile(filePath, contentType){

            response.writeHead(200, { "content-type": contentType });

            //建立流对象，读文件

            var stream = fs.createReadStream(filePath);

            //错误处理

            stream.on('error', function() {

                response.writeHead(500, { "content-type": contentType });

                response.end("<h1>500 Server Error</h1>");

            });

            //读取文件

            stream.pipe(response);

        }

    });

}

这个配置可以对文件的类型，路径进行解析。

因为我的项目静态资源都在public文件下所以这里就写成public。大家可根据自己项目路径来配置

   //这里是是访问项目静态资源的路径 我的项目静态文件都在public下所以我写public可根据自己项目路径来配置

  var filePath = path.resolve("public" + pathName);

这里设置的是端口号，可以根据需要自己来更改

var port = 80;
//指定一个监听的接口

httpServer.listen(port, function() {

    console.log(`app is running at port:${port}`);

    console.log(`url: http://localhost:${port}`);

    cp.exec(`explorer http://localhost:${port}`, function () {

    });//这行代码作用是项目运行成功后自动打开项目网页不想要的话可以去掉

});

然后直接启动 node node.js项目就跑起来了，静态文件全部正确加载了，跳转链接也可以用。访问的话直接访问域名或Ip名就能直接打开项目页面了

用node.js搭建一个静态资源站 html,js,css正确加载 跳转也完美实现！的更多相关文章

  1. 搭建nginx静态资源站

    搭建静态资源站包括以下几部分: root指令与alias指令的区别 使用gzip压缩资源 如何访问指定目录下的全部资源文件 如何限制访问流量 如何自定义log日志 root指令与alias指令的区别 ...

  2. nginx系列3：搭建一个静态资源web服务器

    搭建静态资源web服务器 1,创建静态页面 在nginx的安装目录(/usr/local/nginx)下创建文件夹webapplications/helloworld,然后创建一个名为index.ht ...

  3. 从零开始,在windows上用nodejs搭建一个静态文件服务器

    从零开始,在windows上用nodejs搭建一个静态文件服务器 首先安装nodejs: 新建一个node文件夹 下载node.exe到该文件夹 下载npm然后解压到该文件夹 现在node文件夹是这样 ...

  4. 如何用webgl(three.js)搭建一个3D库房,3D仓库,3D码头,3D集装箱可视化孪生系统——第十五课

    序 又是快两个月没写随笔了,长时间不总结项目,不锻炼文笔,一开篇,多少都会有些生疏,不知道如何开篇,如何写下去.有点江郎才尽,黔驴技穷的感觉. 写随笔,通常三步走,第一步,搭建框架,先把你要写的内容框 ...

  5. 如何用webgl(three.js)搭建一个3D库房,3D仓库3D码头,3D集装箱,车辆定位,叉车定位可视化孪生系统——第十五课

    序 又是快两个月没写随笔了,长时间不总结项目,不锻炼文笔,一开篇,多少都会有些生疏,不知道如何开篇,如何写下去.有点江郎才尽,黔驴技穷的感觉. 写随笔,通常三步走,第一步,搭建框架,先把你要写的内容框 ...

  6. 利用git+hugo+markdown 搭建一个静态网站

    利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...

  7. 使用webgl(three.js)搭建一个3D智慧园区、3D建筑，3D消防模拟，web版3D,bim管理系统——第四课

    序:这段时间忙于奔波,好久没有更新了,今天更新一下,继续上节课的完善讲解,算是对前段时间的一个总结吧.披星戴月的时光也算有点应用效果了. 对于webgl(three.js)性能这一块我在上节课< ...

  8. SpringMVC中css,js,图片等静态资源被拦截的解决办法

    一.静态资源的存放路径 css,js,图片等静态资源存放在项目的路径必须为 二.html.jsp导入静态资源文件 html.jsp页面中的导入静态资源文件: js: css: 图片: 二.web.xm ...

  9. 如何用webgl(three.js)搭建一个3D库房,3D密集架,3D档案室（升级版）

    很长一段时间没有写3D库房,3D密集架相关的效果文章了,刚好最近有相关项目落地,索性总结一下 与之前我写的3D库房密集架文章<如何用webgl(three.js)搭建一个3D库房,3D密集架,3 ...

随机推荐

  1. CSS3面包屑菜单导航

    在线演示 本地下载

  2. 关于Faster-RCNN训练细节

    Faster RCNN训练: 四部训练法: Faster R-CNN,可以大致分为两个部分,一个是RPN网络,另一个是Fast R-CNN网络,前者是一种候选框(proposal)的推荐算法,而后者则 ...

  3. html重置模板

    新浪的初始化: html,body,ul,li,ol,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,form,fieldset,legend,img { margin: 0; paddin ...

  4. python基础之初始函数

    首先,为什么要使用函数? 函数的本质来说,就是写一串代码具有某些功能,然后封装起来,接下来可以很方便的调用 例如...然后... # s = '金老板小护士'# len(s) #在这里需求是求字符串s ...

  5. Java 子类继承父类成员中的问题

    之前搞错了,变量没有“重写”一说,只有方法才能被“重写”.如果我们在子类中声明了一个和父类中一样的变量,那么实际的情况是,子类的内存堆中会有类型和名字都相同的两个变量. 现在考虑一种情况,如下所示,我 ...

  6. 预约系统（二） MVC框架搭建

    采用VS2013,自带的MVC4来搭建 MODEL层,表对象的建立: T_Bm.cs using System; using System.Collections.Generic; using Sys ...

  7. C#中static修饰符的作用

    static在C#中表示的是静态的,比如一个静态的字段是归类型所有,而非归对象所有,也就是说,在调用这个字段时,只能用类型去调,而不能用对象. 实例字段时随着对象创建而创建,对象销毁而销毁,而静态字段 ...

  8. Arduino控制LED灯（开关控制）

    问题:当使用"digitalRead(BUT) == 1"控制LED灯时会出现"digitalWrite(LED, ledState);"的值出现跳动. 原因: ...

  9. MySQL存储引擎知多少

    MySQL是我们经常使用的数据库处理系统(DBMS),不知小伙伴们有没有注意过其中的“存储引擎”(storage_engine)呢?有时候面试题中也会问道MySQL几种常用的存储引擎的区别.这次就简短 ...

  10. mysql prompt的用法详解

    prompt命令可以在mysql提示符中显示当前用户.数据库.时间等信息 代码如下: mysql -uroot -p --prompt="\\u@\\h:\\d \\r:\\m:\\s> ...