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


Posted in NodeJs onApril 01, 2017

做前端的都知道,公司的项目在自己的电脑上搭建环境是挺麻烦的一件事情

  1. 首先:一般个人电脑没公司的配置性能好,
  2. 其次:搭建公司项目在自己电脑涉及很多缓存环境,资源环境包,数据库等的限制,加起来够搞一天了(熟悉公司搭建的环境除外)

就我自身公司而言情况是这样,我作为前端工程师,

前端目前是基于polymer——实现最近遇到的问题就是不知道自己写的页面有没有什么问题,但是要成功启动项目的tomcat才能看,因为这些页面无法直接打开,会包资源解析错误,

于是我在想,如何才能把前端页面不依赖tomcat这些蛋疼的部署服务器呢?

于是百度看到了nodejs和nginx,带着对前端服务器的好奇开始了自己的实践,一个晚上也请教了一些同学,然后得到了一些启发

步骤如下

1、到nodejs官网下载安装包http://nodejs.cn/安装完成后自动映射了环境到系统中,不需要自己配置环境变量,然后打开控制台
输入命令:node

没有报错表示运行成功

2、接着在与测试目录同级目录下面新建下面两个js文件

http.js(服务器脚本配置文件)

var PORT = 3000;//

var http = require('http');
var url=require('url');
var fs=require('fs');
var mine=require('./mine').types;//
var path=require('path');

var server = http.createServer(function (request, response) {
  var pathname = url.parse(request.url).pathname;
  var realPath = path.join("webapp", pathname);  //这里设置自己的文件名称;

  var ext = path.extname(realPath);
  ext = ext ? ext.slice(1) : 'unknown';
  fs.exists(realPath, function (exists) {
    if (!exists) {
      response.writeHead(404, {
        'Content-Type': 'text/plain'
      });

      response.write("This request URL " + pathname + " was not found on this server.");
      response.end();
    } else {
      fs.readFile(realPath, "binary", function (err, file) {
        if (err) {
          response.writeHead(500, {
            'Content-Type': 'text/plain'
          });
          response.end(err);
        } else {
          var contentType = mine[ext] || "text/plain";
          response.writeHead(200, {
            'Content-Type': contentType
          });
          response.write(file, "binary");
          response.end();
        }
      });
    }
  });
});
server.listen(PORT);
console.log("Server runing at port: " + PORT + ".");

mine.js(引入对应的文件)

exports.types = {
 "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"
};

上面两个js新建成功后,打开http.js,接着在里面找到路径设置,把我当前webapp改成你自己的名字项目名称

Friendship tips:(前提是跟js在同级个目录。如果测试项目在其他文件,那么路径可能要设置绝对路径了_这个我没尝试)
下面是我的目录对应的文件,三个箭头是必备的其他无需设置

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

3、控制台启动服务器测试是否成功

见下图:

打开项目所在目录输入node http.js

接着提示端口启动成功,

接着直接输入自己需要测试的文件地址就行了。比如我的 http://localhost:3000/index.html

到此全部部署完成!

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

这里注意:一定要在端口号后面加上自己文件路径才能运行成功。不然会报错因为http.js里面写的比较简单,暂时未直接映射
http://localhost:3000

如果出错了那么请重写启动服务

即:Node.js

当然你有兴趣的话可以重写node.js完善它

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

最后表示:这两个js都是我在博客和百度上看到一些大牛写的,不过他们的写的教程不够清晰(本人水平不足不能跟上他们的思路), 所以再次感谢这些博客大牛.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
基于NodeJS的前后端分离的思考与实践(二)模版探索
Sep 26 NodeJs
基于NodeJS的前后端分离的思考与实践(五)多终端适配
Sep 26 NodeJs
Nodejs下用submit提交表单提示cannot post错误的解决方法
Nov 21 NodeJs
nodejs个人博客开发第二步 入口文件
Apr 12 NodeJs
nodejs 终端打印进度条实例代码
Apr 22 NodeJs
nodejs multer实现文件上传与下载
May 10 NodeJs
Nodejs 和 Electron ubuntu下快速安装过程
May 04 NodeJs
nodejs 如何手动实现服务器
Aug 20 NodeJs
nodejs文件夹深层复制功能
Sep 03 NodeJs
Nodejs使用archiver-zip-encrypted库加密压缩文件时报错(解决方案)
Nov 18 NodeJs
Nodejs实现WebSocket代码实例
May 19 NodeJs
在NodeJs中使用node-schedule增加定时器任务的方法
Jun 08 NodeJs
nodejs使用express创建一个简单web应用
Mar 31 #NodeJs
nodejs实现邮件发送服务实例分享
Mar 29 #NodeJs
NodeJs测试框架Mocha的安装与使用
Mar 28 #NodeJs
NodeJS测试框架mocha入门教程
Mar 28 #NodeJs
nodejs模块nodemailer基本使用-邮件发送示例(支持附件)
Mar 28 #NodeJs
angular2+nodejs实现图片上传功能
Mar 27 #NodeJs
深入nodejs中流(stream)的理解
Mar 27 #NodeJs
You might like
php操作sqlserver关于时间日期读取的小小见解
2009/11/29 PHP
php 连接mssql数据库 初学php笔记
2010/03/01 PHP
php预定义变量使用帮助(带实例)
2013/10/30 PHP
laravel5创建service provider和facade的方法详解
2016/07/26 PHP
PHP魔术方法之__call与__callStatic使用方法
2017/07/23 PHP
网页和浏览器兼容性问题汇总(draft1)
2009/06/01 Javascript
JavaScript Event事件学习第一章 Event介绍
2010/02/07 Javascript
js 点击按钮弹出另一页,选择值后,返回到当前页
2010/05/26 Javascript
onsubmit阻止form表单提交与onclick的相关操作
2010/09/03 Javascript
jquery自定义属性(类型/属性值)
2013/05/21 Javascript
调试代码导致IE出错的避免方法
2014/04/04 Javascript
JavaScript中的Math.LOG2E属性使用详解
2015/06/14 Javascript
javascript实现五星评价代码(源码下载)
2015/08/11 Javascript
全面详细的jQuery常见开发技巧手册
2016/02/21 Javascript
vue.js中父组件调用子组件的内部方法示例
2017/10/22 Javascript
使用Bootrap和Vue实现仿百度搜索功能
2017/10/26 Javascript
微信小程序之多文件下载的简单封装示例
2018/01/29 Javascript
Vue自定义过滤器格式化数字三位加一逗号实现代码
2018/03/23 Javascript
JavaScript callback回调函数用法实例分析
2018/05/08 Javascript
react build 后打包发布总结
2018/08/24 Javascript
Jquery异步上传文件代码实例
2019/11/13 jQuery
JavaScript, select标签元素左右移动功能实现
2020/05/14 Javascript
JavaScript实现滚动加载更多
2020/12/27 Javascript
50行Python代码实现人脸检测功能
2018/01/23 Python
Python反射和内置方法重写操作详解
2018/08/27 Python
Python求均值,方差,标准差的实例
2019/06/29 Python
深入了解Django中间件及其方法
2019/07/26 Python
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
美国专业消费电子及摄影器材网站:B&H Photo Video
2019/12/18 全球购物
口腔工艺技术专业毕业生自荐信
2013/09/27 职场文书
五一家具促销方案
2014/01/10 职场文书
优秀村官事迹材料
2014/01/10 职场文书
幼儿园庆六一游园活动方案
2014/01/29 职场文书
2014年秋季开学典礼主持词
2014/08/02 职场文书
学生犯错保证书
2015/05/09 职场文书
草房子读书笔记
2015/06/29 职场文书