TWaver办公网拓扑图

最新推荐文章于 2022-04-22 18:51:43 发布

辛苦的码农20200609

最新推荐文章于 2022-04-22 18:51:43 发布

阅读量783

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog_hj10bj00a0cb.html

版权

前端专栏收录该内容

785 篇文章 4 订阅

订阅专栏

Node搭建本地服务

根据demo文件夹位置，右键启动命令窗口（shift+右键---在此处打开命令窗口）

检测node版本及npm版本

命令行输入：node -v
命令行输入：npm -v

文件夹新建server.js文件（启动服务用的，监听服务），代码如下：

const PORT = 8888; //访问端口号8888   //端口号最好为6000以上
var http = require('http'); //引入http模块
var fs = require('fs'); //引入fs模块
var url = require('url');//引入url模块
var path = require('path');//引入path模块
// req : 从浏览器带来的请求信息
// res : 从服务器返回给浏览器的信息
var server = http.createServer(function(req,res){
    var pathname = url.parse(req.url).pathname;;
     //客户端输入的url，例如如果输入localhost:8888/index.html，那么这里的url == /index.html 
     //url.parse()方法将一个URL字符串转换成对象并返回，通过pathname来访问此url的地址。

    var realPath = path.join('C:/Users/Administrator/Desktop/拓扑图案例测试',pathname);
    //完整的url路径
    console.log(realPath);  
    // F:/nodejs/nodetest/index.html

    fs.readFile(realPath,function(err,data){
        /*
        realPath为文件路径
        第二个参数为回调函数
            回调函数的一参为读取错误返回的信息，返回空就没有错误
            二参为读取成功返回的文本内容
        */
        if(err){
            //未找到文件
            res.writeHead(404,{
                'content-type':'text/plain,charset=UTF-8'
            });
            res.write('404,not found page');
            res.end();
        }else{
            //成功读取文件
            res.writeHead(200,{
                'content-type':'text/html,charset=UTF-8'
            });
            res.write(data);
            res.end();
        }
    })
});
server.listen(PORT); //监听端口
console.log('服务成功开启')

新建index.html文件，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>node Test</title>
    <style type="text/css">
        html,body{
            margin: 0;
            padding: 0;
        }
        .node{
            width: 300px;
            margin: 0 auto;
            padding-top:100px; 
            text-align: center;
        }
        .node h1{
            color:rgb(33,199,40);
        }
    </style>
</head>
<body>
    <div class="node">
        <h1>Hello Nodejs</h1>
    </div>
</body>
</html>

浏览器地址栏输入：localhost:8888/index.html,效果如下：

引入TWaver里面的OfficeNetwork.html（即test3.html，附件提供源码）

取出test3.html内data数据，存入新建的dataJson.json文件,如下图：

修改数据渲染方式,ajax不加async:false时，渲染如下：

正常处理方式如下

如上操作后，拓扑图渲染如下：

至此，小结结束，源码下载如下：

链接: https://pan.baidu.com/s/1P73xGj4M_Bpc1qnY6ypXBw 密码: svc7
如链接失效，请联系博主：QQ995474219

辛苦的码农20200609

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
TWaver办公网拓扑图

Node搭建本地服务根据demo文件夹位置，右键启动命令窗口（shift+右键---在此处打开命令窗口）检测node版本及npm版本命令行输入：node -v命令行输入：npm -v文件夹新建server.js文件（启动服务用的，监听服务），代码如下：const PORT = 8888; //访问端口号8888 //端口号最好为6000以上var http = require('http'); //引入http模块var fs = require('fs'); //引入fs模块var
复制链接

扫一扫