版权声明:未经本人同意不得私自转载 https://blog.csdn.net/qq_40190624/article/details/82873640
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script src="easyhttp.js"></script>
<script src="app.js"></script>
</body>
</html>
封装的js文件内容(easyhttp.js)
/*
* @Author: mikey.zhaopeng
* @Date: 2018-09-27 20:03:13
* @Last Modified by: mikey.zhaopeng
* @Last Modified time: 2018-09-27 21:20:53
*/
class EasyHttp{
get(url){
return new Promise((resolve,reject)=>{
fetch(url)
.then( res => res.json())
.then( data => resolve(data))
.catch(err => reject(err))
})
}
// post方式
post(url,data){
return new Promise((resolve,reject)=>{
fetch(url,{
method:'POST',
headers:{
'Content-type':'application/json'
},
body:JSON.stringify(data)
})
.then( res => res.json())
.then( data => resolve(data))
.catch(err => reject(err))
})
}
//put 修改
put(url,data){
return new Promise((resolve,reject)=>{
fetch(url,{
method:'PUT',
headers:{
'Content-type':'application/json'
},
body:JSON.stringify(data)
})
.then( res => res.json())
.then( data => resolve(data))
.catch(err => reject(err))
})
}
//delete
delete(url,data){
return new Promise((resolve,reject)=>{
fetch(url,{
method:'DELETE',
headers:{
'Content-type':'application/json'
},
body:JSON.stringify(data)
})
.then( res => res.json())
.then( data => resolve('数据删除成功!'))
.catch(err => reject(err))
})
}
}
使用的js文件内容:(app.js)
const http = new EasyHttp;
// get请求数据
http.get('http://jsonplaceholder.typicode.com/users')
.then((data) =>{
console.log(data)
})
.catch(err => console.log(err))
// post传输数据
const data = {
name:'carrie',
username:'渣渣芳',
email:'[email protected]'
};
//post user
http.post('http://jsonplaceholder.typicode.com/users',data)
.then(data => console.log(data))
.catch(err => console.log(err))
// update user ,修改后会发现修改后ID为2的数据会变成上页面定义的data
http.put('http://jsonplaceholder.typicode.com/users/2',data)
.then(data => console.log(data))
.catch(err => console.log(err))
//delete user 删除下标为2里的数据
http.delete('http://jsonplaceholder.typicode.com/users/2',data)
.then(data => console.log(data))
.catch(err => console.log(err))