Axios
先引入axios npm install axios
const axj = axios.create({
baseURL:"http://kumanxuan1.f3322.net:8001/", //所有的接口请求的公共域名地址
tiomout:1000, //可选项,单位毫秒,设置前端接口请求时间,过了时间就终止请求。
headers:{"Content-Type":"Application/json"} //可选项 设置请求头
})
const vm = new Vue({
el:"#app",
data:{
},
methods:{
},
created(){
// 请求首页数据
axj({
method:"get", //请求方式 get 请求
url:"/index/index", //拼接上面的公共域地址
parmas:{ //get传值,post用data
name:"张三",
age:20
}
}).then(res=>{
console.log(res) //获取到的数据
})
}
})
fetch
他是浏览器window 下的方法 ,无需引入,该fetch 是一个函数,函数调用返回一个promise对象 支持promise。
get请求:
// 发起fetch 请求 get请求
fetch('https://api.i-lynn.cn/college?id=100').then(res => {
// res 只是一个 HTTP 响应,而不是真的 JSON
// 将响应 body 解析成 JSON 的 promise
return res.json()
}).then(res => {
console.log(11, res);
})
post请求:
fetch('https://api.i-lynn.cn/college', {
method: "post",
headers: {// post请求需要设置请求头,
'Content-Type': 'application/x-www-form-urlencoded', //设置请求参数的格式为表单编码格式
},
body: 'name=张三&age=20',
}).then(res => {
return res.json()
}).then(res => {
console.log(33, res);
})