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的10个性能优化技巧
Jul 15 NodeJs
nodejs教程之入门
Nov 21 NodeJs
轻松创建nodejs服务器(1):一个简单nodejs服务器例子
Dec 18 NodeJs
nodejs中全局变量的实例解析
Mar 07 NodeJs
angular2+nodejs实现图片上传功能
Mar 27 NodeJs
NodeJS自定义模块写法(详解)
Jun 27 NodeJs
nodejs实现超简单生成二维码的方法
Mar 17 NodeJs
nodeJS模块简单用法示例
Apr 21 NodeJs
nodejs 如何手动实现服务器
Aug 20 NodeJs
nodejs图片处理工具gm用法小结
Dec 12 NodeJs
nodejs各种姿势断点调试的方法
Jun 18 NodeJs
如何利用nodejs自动定时发送邮件提醒(超实用)
Dec 01 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中3des加密代码(完全与.net中的兼容)
2012/08/02 PHP
解析在zend Farmework下如何创立一个FORM表单
2013/06/28 PHP
PHP中使用sleep函数实现定时任务实例分享
2014/08/21 PHP
一个不错的用JavaScript实现的UBB编码函数
2007/03/09 Javascript
分享27个jQuery 表单插件集合推荐
2011/04/25 Javascript
TreeView 用法(有代码)(asp.net)
2011/07/15 Javascript
Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因
2013/05/07 Javascript
基于js disabled="false"不起作用的解决办法
2013/06/26 Javascript
JS中完美兼容各大浏览器的scrolltop方法
2015/04/17 Javascript
jQuery.each使用详解
2015/07/07 Javascript
php基于redis处理session的方法
2016/03/14 Javascript
JavaScript编写带旋转+线条干扰的验证码脚本实例
2016/05/30 Javascript
jQuery+CSS3文字跑马灯特效的简单实现
2016/06/25 Javascript
easyui datagrid 大数据加载效率慢,优化解决方法(推荐)
2016/11/09 Javascript
jQuery插件HighCharts绘制2D带有Legend的饼图效果示例【附demo源码下载】
2017/03/10 Javascript
详解如何使用webpack打包Vue工程
2017/05/27 Javascript
nodejs 子进程正确的打开方式
2017/07/03 NodeJs
深入理解vue Render函数
2017/07/19 Javascript
karma+webpack搭建vue单元测试环境的方法示例
2018/05/24 Javascript
layui的select联动实现代码
2019/09/28 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
jQuery操作事件完整实例分析
2020/01/10 jQuery
解决Vue router-link绑定事件不生效的问题
2020/07/22 Javascript
简单了解JavaScript作用域
2020/07/31 Javascript
python定时执行指定函数的方法
2015/05/27 Python
Python的Django框架中的表单处理示例
2015/07/17 Python
使用python实现生成用户信息
2017/03/20 Python
python实现支付宝转账接口
2019/05/07 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
python 利用已有Ner模型进行数据清洗合并代码
2019/12/24 Python
Python中无限循环需要什么条件
2020/05/27 Python
《长城》教学反思
2014/02/14 职场文书
计划生育标语
2014/06/23 职场文书
2014工程部年度工作总结
2014/12/17 职场文书
【海涛dota】偶遇拉娜娅 质量局德鲁伊第一视角解说
2022/04/01 DOTA
Linux安装Docker详细教程
2022/07/07 Servers