Node基础篇(一)

Node内置对象

1、全局对象无论是在Node程序中哪个地方,哪个时间都能够访问,主要有一下几个对象

  • process
process.env,可以通过process.env.xxx来获取系统中的环境变量值,可以通过根据不同的环境变量的值生成不同的配置,已达到不同的开发环境运行效果

具体用法:

// 在这里可以通过不同运行环境引入不同的配置,如端口号、文件编译压缩出口等等
let cif = proccess.env.development ?  ...require( config.production || config.development ) 复制代码

process.argv,获取命令行参数

//add文件,在这里,可以通过输入命令行,然后加两个数字做一个简单的加法
let num1 = parseInt(process.argv[2]);
let num2 = parseInt(process.argv[3]);
let sum = num1 + num2;
setTimeout(()=>{
 console.log(sum);
}.1000)


//然后通过运行Node命令行,process.argv=>[node绝对路径,文件的绝对路径,参数1,参数2,...]
node ./add.js (文件路径) 1(第一个参数) 3(第二个参数)

复制代码

  • filename/dirname

__filename,获取当前运行文件的绝对路径

__dirname,获取当前运行文件的目录的绝对路径

2、核心对象(需要向系统引入,不需要下载)

  • path

path.resolve(__dirname,xxx,xxx),将路径或路径片段的序列解析为绝对路径

path.join(__dirname,xxx,xxx),将字符串拼接起来解析成路径

path.join(__dirname), 将路径解析成一个对象

3、自定义对象
需要下载,按照路径引入

文件引入、导出

// 引入文件
const xxx = require('XXX')
// 导出文件
const xxx = 对象/函数
module.exports xxx复制代码

fs模块,文件读写操作

  1. fs.readFile(异步读取文件的全部内容)

const fs = require('fs');
let filepath = 'xxx'; //读取文件的路径
// 如果data是
fs.readFile(filepath,'utf-8',(error,data)=>{
    if(error)
        console.log(error)
    // 回调函数返回的是二进制数据Buffer
    console.log(data);
    // 需要输出字符串的话,可以通过toString()转换
    console.log(data.toString())
})复制代码

 2. fs.wirteFile(异步将数据写入文件,如果文件已存在则覆盖改文件)

const fs = require('fs')
let filepath = 'xxx' //写入文件的路径
// data可以是一个字符串,也可以为buffer,若data为buffer,encoding(utf-8)则被忽略
fs.writeFile(filepath,data,'utf-8',(error)=>{
    if(error){
        console.log(error);
    }
})复制代码

3.fs.writeFileSync(同步写入文件)

fs.writeFileSync(file,data)复制代码

4.fs.readFileSync (同步读取文件)

fs.readFileSync(file,data)复制代码


相关补充点:

fs.access(测试用户对filepath指定的文件或目录的权限)

fs.state(获取文件的状态)

fs.readdir(读取文件目录)

fs.stats类

  • stats.isFile(判断是否为文件)
  • stats.isDireactor(判断是否为文件夹)

const fs = require('fs');
const path = require('path);
let filepath = 'xxx';
// 判断文件是否存在
method = fs.constants.F_OK;
/*
fs.constants.W_OK 文件是否可写
fs.constants.R_OK 文件是否可
*
function findFile(filepath){
    try{
        fs.access(filepath,method);
        console.log(${filepath} ${error? '不存在':'存在'});
        let state = fs.stateSync(filepath);
        if(state.isfile()){
            console.log(filepath);
        }else(state.isDireactory()){
        let files = fs.readdirSync(filepath);
        files.forEach(file => {
           findFile(path.join(filepath,file));
        });
    }catch(e){
        console.log(e);
    }
}

复制代码

读写流——压缩、加密(fs.createReadStream、fs.createWriteStream、zlib)

const http = require('http');
const fs = require('fs');
const zlib = require('zlib');

http.createServer((req,res)=>{
    let filePath = 'xxx'; // 读取文件的路径
    
    let rs = fs.createReadStream(filePath); //创建读取流
    rs.on('error',(error)=>{});
    res.setHeadr('content-encoding','gzip'); //发送响应头,告知浏览器返回的数据格式
    let gz = zlip.createGzip(); // 压缩
    rs.pipe(gz).pipe(res); // pipe管道,将上一步的结果作为输入,然后进行相应的处理
}).listen(8080);复制代码

http模块 

// 创建一个server服务
const http = require('http');
let server = http.createServer((req,res)=>{
    // req 是浏览器请求的内容,有关请求的内容都可以从req里面获取
    // res 是服务器返回的响应
    res.write();
    res.end();
})
server.listen(8080);复制代码

原生Node常见解析GET提交的表单数据

const http = require('http');
const url = require('url');

http.createServer((req,res)=>{    
    console.log(req.url); // 输出例子: /aaa?user=test&password=123,/aaa为地址,后面为数据    
    let {pathname,query} = url.parse(req.url,true);    
    console.log(pathname); // 输出 /aaa    
    console.log(query); //输出 {username: 'test', password: '123'},将GET请求方式的数据解析成一个对象
}).listen(8080);复制代码

原生Node常见解析POST提交普通表单数据

const http=require('http');
const querystring=require('querystring');

let server=http.createServer(function (req, res){
let url = req.url;
console.log(req.url); // /aaa,因为是POST方式,所以地址不带有数据
  let arr=[];
  // 这里接收的data为十六进制数据
  req.on('data', buffer=>{
    arr.push(buffer);
  });
  req.on('end', ()=>{
    let buffer=Buffer.concat(arr);
    console.log(buffer.toString()); // user=test&password=123
    let post=querystring.parse(buffer.toString());
    console.log(post); // {user: 'test',password: '123}
  });
});
server.listen(8080);复制代码

querystring.parse(),将user=test&password=123这类数据格式转换成一个json对象

quertstring.stringify(),将json对象转换成user=test&password=123数据格式


multiparty解析上传文件

(需要将HTML中form表单提交方式为POST,enctype="multipart/formdata")

使用前先下载  

npm i multiparty复制代码

const http=require('http');
const multiparty=require('multiparty');

http.createServer((req, res)=>{
  let form=new multiparty.Form({
    uploadDir: './upload' //文件上传的路径
  });

  form.parse(req);
  // 解析普通form表单数据
  form.on('field', (name, value)=>{
    console.log('字段:', name, value); //user 123
  });
  // 解析上传文件的信息
  form.on('file', (name, file)=>{
    console.log('文件:', name, file);
  });

  form.on('close', ()=>{
    console.log('表单解析完成');
  });
}).listen(8080);复制代码

返回请求头

const http = require('http');
http.createServer((req,res)=>{
    res.setHeader('Content-Type','text/html');
    res.setHeader('x-Foo','bar');
    res.writeHead(200, {'Content-Type': 'text/plain'});
    // res.writeHead(200,{'Content-Type': 'text/html;charset=utf-8'});
    // res.writeHead(200,{'Content-Type': 'application/json'});
    res.end();
}).listen(8080);复制代码

获取请求头

const http = require('http');
http.createServer((req,res)=>{
    let header = req.headers; // 获取请求头
    let url = req.url; // 获取域名
    let method = req.method; //获取请求方式
}).listen(8080);复制代码

原生ajax跨域问题,因为SOP(同源策略机制),ajax向服务器发出请求时(不是直接向服务器发出请求),首先是向浏览器发起请求,然后浏览器再向服务器发出请求,服务器返回请求结果,然后浏览器接收到请求结果,判断请求的结果与ajax是否处于同一域名下,如果不是,则丢弃,反之,则将结果返回给ajax。要想原生ajax能成功跨域,则需要服务器做出声明。

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script>
    window.onload=function (){
      let oBtn=document.getElementById('btn1');

      oBtn.onclick=function (){
        let ajax=new XMLHttpRequest();

        ajax.open('GET', 'http://localhost:8080/a', true);
        ajax.send();

        ajax.onreadystatechange=function (){
          if(ajax.readyState==4){
            if(ajax.status==200){
              alert('成功');
              let json=JSON.parse(ajax.responseText);
              console.log(json);
            }else{
              alert('失败');
            }
          }
        };
      };
    };
    </script>
  </head>
  <body>
    <input type="button" value="请求" id="btn1">
  </body>
</html>复制代码

const http = require('http');
http.createServer((req,res)=>{
    let allOrigin = {
        'http://localhost': 'true',
        'http://xxx.xxx': 'true',
        'http://xxx/xxx': 'true'
    }
    
    // 获取域名
    let { origin } = req.headers;
    
    // 发送声明
    if(allOrigin[origin]){
        res.setHeader('access-control-allow-origin','*');
    }
}).listen(8080);复制代码

fetch请求方式

(原生,可以解析普通文本、JSON、二进制数据)

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script>
    window.onload=function (){
      let oBtn=document.getElementById('btn1');
      let img1=document.getElementById('img1');
      // fetch是异步请求的方式,这里利用了ES6的async/await语法
      oBtn.onclick=async function (){
        
        //1.请求
        // let res=await fetch('data/1.txt'); //普通文本数据
        // let res = await fetch('data/1.json'); //json数据
        let res = await fetch('data/1.png'); // 二进制数据
        
        //2.解析数据,也是异步方式
        // let str= await res.text();
        // alert(str);

        // let json = await res.json();
        // console.log(json);
        let data = await res.blod(); //解析二进制数据
        let url = URL.createObjectURL(data); //在本地临时创建保存一个url
        img1.src = url;
      };
    };
    </script>
  </head>
  <body>
    <input type="button" value="读取" id="btn1">
    <img id="img1" />
  </body>
</html>复制代码

FormData

FormDate(前端处理表单数据,然后交给ajax提交数据)、Ajax、multiparty(Node)配合使用

原生Ajax提交数据

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <form id="form1" action="http://localhost:8080/" method="post">
      用户:<input type="text" name="user" /><br>
      密码:<input type="password" name="pass" /><br>
      文件:<input type="file" name="f1" /><br>
      <input type="submit" value="提交">
    </form>
  </body>
  <script>
  let oForm=document.querySelector('#form1');

  oForm.onsubmit=function (){
    let formdata=new FormData(oForm);

    let xhr=new XMLHttpRequest();

    xhr.open(oForm.method, oForm.action, true);
    xhr.send(formdata);

    xhr.onreadystatechange=function (){
      if(xhr.readyState==4){
        if(xhr.status==200){
          alert('成功');
        }else{
          alert('失败');
        }
      }
    };

    return false;
  };
  </script>
</html>复制代码

const http=require('http');
const multiparty=require('multiparty');

http.createServer((req, res)=>{
  let form=new multiparty.Form({
    uploadDir: './upload' //文件上传的路径
  });

  form.parse(req);
  // 解析普通form表单数据
  form.on('field', (name, value)=>{
    console.log('字段:', name, value); //user 123
  });
  // 解析上传文件的信息
  form.on('file', (name, file)=>{
    console.log('文件:', name, file);
  });

  form.on('close', ()=>{
    console.log('表单解析完成');
  });
}).listen(8080);复制代码

JQuery-Ajax

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <form id="form1" action="http://localhost:8080/" method="post">
      用户:<input type="text" name="user" /><br>
      密码:<input type="password" name="pass" /><br>
      文件:<input type="file" name="f1" /><br>
      <input type="submit" value="提交">
    </form>
  </body>
  <script src="jquery.js" charset="utf-8"></script>
  <script>
  $('#form1').on('submit', function (){
    let formdata=new FormData(this);

    $.ajax({
      url: this.action,
      type: this.method,
      data: formdata,
      /* JQuery会自动将data中上传的数据转换成另外一种格式,所以会导致数据格式不正确,导致失败 */
      processData: false, // 不需要转换数据格式
      /* JQuery会自动提交一个contentType,导致失败 */
      contentType: false // 不需要篡改contentType
    }).then(res=>{
      alert('成功');
    }, res=>{
      alert('失败');
    });

    return false;
  });
  </script>
</html>复制代码

若无form表单,可自定义一个FormData(Ajax2.0),然后在FormData里添加内容

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div id="div1">
      用户:<input type="text" id="user" /><br>
      密码:<input type="password" id="pass" /><br>
      文件:<input type="file" id="f1" /><br>
      <input id="btn1" type="button" value="提交">
    </div>
  </body>
  <script>
  let oBtn=document.querySelector('#btn1');
  oBtn.onclick=function (){
    let formdata=new FormData();

    formdata.append('username', document.querySelector('#user').value);
    formdata.append('password', document.querySelector('#pass').value);
    formdata.append('f1', document.querySelector('#f1').files[0]);

    //
    let xhr=new XMLHttpRequest();

    xhr.open('post', 'http://localhost:8080/', true);
    xhr.send(formdata);

    xhr.onreadystatechange=function (){
      if(xhr.readyState==4){
        if(xhr.status==200){
          alert('成功');
        }else{
          alert('失败');
        }
      }
    };
  };
  </script>
</html>复制代码

Websocket(性能高、双向发送数据,天然加密)

原生Websocket创建连接:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script>
    // 创建scoket
    let ws=new WebSocket('ws://localhost:8080/');
    
    // 建立连接
    ws.onopen=function (){
      alert('连接已建立');
    };
    // 数据交互
    ws.onmessage=function (){};
    // 连接关闭
    ws.onclose=function (){};
    // 连接发送错误
    ws.onerror=function (){};
    </script>
  </head>
  <body>

  </body>
</html>
复制代码

const net=require('net');
const crypto=require('crypto');

// 解析浏览器请求头(字符串),解析成JSON对象
function parseHeader(str){
  let arr=str.split('\r\n').filter(line=>line);
  arr.shift();

  let headers={};
  arr.forEach(line=>{
    let [name, value]=line.split(':');

    name=name.replace(/^\s+|\s+$/g, '').toLowerCase();
    value=value.replace(/^\s+|\s+$/g, '');

    headers[name]=value;
  });

  return headers;
}

// 创建服务器
let server=net.createServer(sock=>{
  sock.once('data', buffer=>{
    // 首次接收请求头可转换成字符串
    let str=buffer.toString();
    let headers=parseHeader(str);
    
    // 判断浏览器发来的请求头中协议是否升级为websocket
    if(headers['upgrade']!='websocket'){
      console.log('no upgrade');
      sock.end();
    }else if(headers['sec-websocket-version']!='13'){ //判断websocket版本
      console.log('no 13');
      sock.end();
    }else{
      // 获取key
      let key=headers['sec-websocket-key'];

      // websocket固定的验证方式
      let uuid='258EAFA5-E914-47DA-95CA-C5AB0DC85B11';
      let hash=crypto.createHash('sha1');

      hash.update(key+uuid);
      let key2=hash.digest('base64');
        
      // 发送返回头报文
      sock.write(`HTTP/1.1 101 Switching Protocols\r\nUpgrade: websocket\r\nConnection:upgrade\r\nSec-Websocket-Accept:${key2}\r\n\r\n`);
    }
  });

  sock.on('end', ()=>{

  });
});
server.listen(8080);复制代码

socket.io

(简单方便,自动解析,兼容IE5,自带跨域)

前端用法:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    
    // 服务器自动返回socket.io
    <script src="http://localhost:8080/socket.io/socket.io.js" charset="utf-8"></script>
    <script>

    // 连接scoket.io
    let sock=io.connect('ws://localhost:8080/');
    
    // 发送数据 sock.emit(函数名字,数据值1,数据值2)
    //sock.emit('aaa', 12, 5);

    // 接收数据 sock.in(函数名字,(参数1,参数2)=>{})
    sock.on('timer', time=>{
      console.log(time);
    });

    </script>
  </head>
  <body>

  </body>
</html>复制代码

服务器:

npm i socket.io复制代码

const http=require('http');
const io=require('socket.io');

//1.建立普通http
let server=http.createServer((req, res)=>{});
server.listen(8080);

//2.建立ws
let wsServer=io.listen(server);
wsServer.on('connection', sock=>{
  //sock.emit('name', 数据)
  //sock.on('name', function (数据){});

  /*sock.on('aaa', function (a, b){
    console.log(a, b, a+b);
  });*/

  setInterval(function (){
    sock.emit('timer', new Date().getTime());
  }, 1000);

});
复制代码


转载于:https://juejin.im/post/5cbe5108e51d456e5977b19e

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值