Node基础篇(一)

Node内置对象

一、全局对象不管是在Node程序中哪一个地方,哪一个时间都可以访问,主要有一下几个对象html

  • process
process.env,能够经过process.env.xxx来获取系统中的环境变量值,能够经过根据不一样的环境变量的值生成不一样的配置,已达到不一样的开发环境运行效果

具体用法:前端

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

process.argv,获取命令行参数node

//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,获取当前运行文件的绝对路径react

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

二、核心对象(须要向系统引入,不须要下载)web

  • path

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

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

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

三、自定义对象
须要下载,按照路径引入跨域

文件引入、导出

// 引入文件
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);

});
复制代码
相关文章
相关标签/搜索