2020-11-13原生ajax的网络请求

一，ajax请求

1 创建网络请求的对象
var xhr = new XMLHttpRequest（）||new ACtiveXobject（“XMLHTTP.Micsoft”）
//前面一个是浏览器创建的对象，后面一个是做的兼容IE的。
2 配置连接的服务器
xhr.open(“GET”,“http:192.168.2.66:8080/info”,true) //默认的是异步的 可以直接同步

3发起网络请求
xhr.send() //前端给后端发送数据 ，get 请求这里发了后端也接受不了 ，post相反

   //这个监听是对1234 的监听 何时才可以去取数据在xhr.responsetext中
      xhr.onreadystatechange = function(){
        if(xhr.readState==4&& xhr.status==200){
        //xhr.readState状态有1234反应的是网络请求的过程 4 是数据已经到达前端
                       // xhr.status 是状态码  404 是文件没有   200是请求成功了
                       // 4开头是前端的问题   5开头是服务器的问题
                var p = document.creatElement(P)
                    p.innerHTML=JOSN.parse(xhr.responsetext).age
                                //JOSN字符串转出JOSN对象
                      doucumnet.body.appendchild(p)
    }
}

二，网页的呈现过程

  1 用户访问一个·网址
     做网络请求 后端返回一个文档就是是一个html字符串 浏览器解析这个文档
     
  2  解析的过程 中 凡是遇到了 ajax（xhr的send） src  href url 等等  
     会再次发起网络请求
     
  3 对应的标签和或者语法 网络请求成果 就会把对应数据拿来使用

三，require函数

 require是一个node环境中的一个全局函数，浏览器环境中没有这个函数
 1.1如果是一个模块路径(模块名)
 它就会去当前文件夹中的node_modules文件夹中去找模块
  如果没有就去nodejs的全局安装包中去找:global中
  如果全局中没有会去node的原包中去找
  如果没找到  就会报错:模块不存在
  会去对应的模块文件夹中找到一个项目配置文件,中的main字段中的路径对应的文件,导入

1.2
如果是一个相对路路径/绝对路径
会直接找到文件并导入

2.模块分为3种
系统自带的核心模块==>不用下载,安装node时已经有了
第三方模块==>需要下载到项目中才能导入并使用
自定义模块==>自己写导出然后,导入进来使用

//install可以简写为i
//npm install 模块名字 //安装到本地的(node的安装包中)
//npm i 模块名字 -g // 安装到全局文件夹
//npm i 模块名字 -S // 安装到项目中来(当前文件夹中的,node_modules文件夹中)

自定义模块
var myjquery=require("./src/myjquery.js")
console.log(myjquery)
myjquery.say()
fs.readFile

//js代码
module.exports={
	name:"karen",
	say(){
		console.log("我被调用了")
	}
}

四，静态托管

var http=require("http")
var fs=require("fs")
var app=http.createServer((req,res)=>{
	// if(req.url=="/index.html"){
	// 	fs.readFile(__dirname+"/src/index.html",(err,data)=>{res.end(data)})
	// }
	// else if(req.url=="/css/index.css"){
	// 	fs.readFile(__dirname+"/src/css/index.css",(err,data)=>{res.end(data)})	
	// }
	// else if(req.url=="/img/1.jpg"){
	// 	fs.readFile(__dirname+"/src/img/1.jpg",(err,data)=>{res.end(data)})	
	// }
	// else if(req.url=="/2.html"){
	// 	fs.readFile(__dirname+"/src/2.html",(err,data)=>{res.end(data)})	
	// }
	//静态资源托管: src目录
	fs.readFile(__dirname+"/src"+req.url,(err,data)=>{
		if(err){		
			if(req.url=="/666"){
				res.end('{"name":"karen"}')
			}
			else if(req.url=="/userinfo"){
				res.end('{"name":"jack"}')
			}
			else{
				res.end("404,not found")
			}
		}
		else{
			res.end(data)
		}
	})
	
})
app.listen(8080)

//接口是后端提供的
//接口分为数据接口和静态资源接口
//接口就是后端提供的网址

实现了前端想要什么内容 后端就发什么内容 所有资源放在一个文件夹里面 路径要注意

五，回调函数实现文件的遍历

// var fs = require("fs")
// fs.readdir(__dirname + "/a", (err, files) => {
// 	//console.log(files)
// 	for (let i = 0; i < files.length; i++) {

// 		//console.log(files[i])
// 		fs.stat(__dirname + "/a/" + files[i], (err, info) => {
// 			if (info.isFile()) {
// 				console.log(files[i])			
// 			}else{
				
				
				
// 			}
// 		})
// 	}
// })


var fs = require("fs")
function  fn (path) {
	fs.readdir(path, (err, files) => {
		files.forEach((el)=>{
			fs.stat(path+"/"+el,(err,info)=>{
				if(info.isFile()){console.log(el)}
				else{fn(path+"/"+el)}
			})
		})
	})
}

fn(__dirname+"/a")

回调要又结束判断的条件