#### 包（文件夹） * 多个文件，有效的被组织与管理的一个单位 * 留一个入口 * __包就是一个:文件夹__ #### npm|| yarn * 自己先有一个包描述文件（__package.json__) * 创建一个包描述文件 `npm init [-y]` * 会根据当前的文件夹来自动生成包名（__不允许中文，不允许大写英文字母__) * 默认生成```npm init [-y]``` * 下载一个包 `npm install art-template jquery@1.5.1 --save` - 记录依赖`--save` * 根据package.json文件中的`dependencies`属性恢复依赖 - 恢复包 `npm install` 简单: ```npm i ``` * 卸载一个包 `npm uninstall jquery@1.5.1 --save` * 简写```npm un jquery@1.5.1 --S` * 下载简单些:```npm i 包名``` * __小结:以上简写: uninstall -> un ,install -> i , --save -> -S * 查看包的信息 - `npm info jquery` * 查看包的信息中的某个字段(版本)(掌握) - `npm info jquery versions` * 查看包的文档 - `npm docs jquery` * 安装全局命令行工具 - `npm install -g http-server` * 卸载全局命令行工具 - `npm uninstall -g http-server` * 查看全局包的下载路径 - `npm root -g`
包的区别
-
凡是我们下载到项目的node_modules中的包，基本都是拿来做require('xxx') 调用其函数和属性
-
还有一类属于工具性的包（全局命令行工具)
-
在命令行直接使用的
-
-
全局工具 和项目包的区别
-
全局工具哪个目录都可以通过命令行启动，通过任意目录启动该工具，给相对路径传递任意目录的文件给该工具
-
项目中的包，部分具备命令行工具的能力，需要命令行环境变量的支持
-
http核心模块， 参考博客；https://www.cnblogs.com/fsg6/p/14499743.html
http超文本传输协议
#### 主体对象（核心对象http) * 服务器对象 ```http.createServer();``` * 客户端对象```http.request({host:'www.baidu.com'});``` * 请求报文对象(对于服务器来说，是可读) req * 响应报文对象(对于服务器来说，是可写) res #### 状态码分类 * 1 开头，正在进行中 * 2开头，完成 * 3开头 ，重定向 * 4开头 ， 客户端异常 * 5开头， 服务器异常 #### 创建服务器步骤 * 1:引入http核心对象 * 2:利用http核心对象的.createServer(callback); 创建服务器对象 * 3:使用服务器对象.listen(端口,ip地址) 开启服务器 * 4:callback(req,res) 根据请求处理响应 #### 请求报文对象(只读) * 请求首行中的url `req.url ` * 请求首行中的请求方式 `req.method` * 请求头中的数据`req.headers` 是一个对象 * 头信息中，也可以作为与服务器交互的一种途径 #### 响应对象 * 响应首行 `res.writeHead(状态码)` * 写响应头 * 一次性写回头信息 * `res.writeHead(200,headers)` * 多次设置头信息 * `res.setHeader(key,value);` * 写响应体 * 一次性写回响应体 * `res.end();` * 多次写回响应体 * `res.write();` #### 请求与响应 * 头行体 * content-type是对请求或者响应体数据，做出的说明 #### 响应体数据 * res.write('字符串'||读出文件的二进制数据) * res.end('字符串'||读出文件的二进制数)
server.js
const http = require('http'); const fs = require('fs'); // 设计两个接口， / 返回index.html // /test 只用write 不用end => 默认来讲 页面会一直转 // 但是，如果我用ajax http.createServer((req,res)=>{ if(req.url === '/' ) { fs.readFile('./index.html',(err,data)=>{ res.writeHead(200,{'content-type':'text/html;charset=utf-8'}); res.end(data); }); } else if (req.url === '/test' && req.method === 'GET') { // 告知客户端，可以一点一点的显示，流式写入 res.writeHead(200,{'content-type':'application/octet-stream'}); setInterval(function() { res.write(''+Date.now() +'^_^'); },1000); } }).listen(8888);
index.html
<html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <span id="info"></span> <button id="btn">点我发</button> <script type="text/javascript"> var info = document.querySelector('#info'); document.querySelector('#btn').onclick = function () { // 发起ajax请求 var xhr = new XMLHttpRequest(); xhr.open('get','/test'); xhr.send(); // 处理响应 xhr.onreadystatechange = function () { // readyState = 3 的时候是响应中 console.log(xhr.readyState); //1,2,3,4 console.log(xhr.responseText); var arr = xhr.responseText.split('^_^') console.log(arr[arr.length-2]); info.innerText = arr[arr.length-2]; } } </script> </body> </html>