<!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>axios.create()</title>
</head>
<body>
<!--
1). axios create(config)
a.根据指定配置创建一个新的 axios,也就是每个新 axios都有自己的配置
b.新 axios只是没有取消请求和批量发请求的方法,其它所有语法都是一政的
c.为什么要设计这个语法?
需求:项目中有部分接口需要的配置与另一部分接口需要的配置不太一样,如何处理
解决:创建2个新axios,每个都有自己特有的配置,分别应用到不同变求的接口请求中
-->
</body>
<script src="https://cdn.bootcss.com/axios/0.19.0/axios.min.js"></script>
<script>
//使用axios发请求
axios.defaults.baseURL = 'http://localhost:3000'
axios({
url: '/posts'
})
//-------------------------------------------------------------------------------
//创建一个新的axios
const instance = axios.create({
baseURL: 'http://localhost:3000'
});
//使用instance发请求
//方式一
instance({
url: '/posts'
})
//方式二
instance.get('/posts')
/*
那么问题来了,直接使用axios就可以发送请求了,我为什么还要再创建axios:
假如同一个项目,你要从不同的url地址来请求接口怎么办?
url地址1:http://localhost:3000
url地址2:http://localhost:3002
url地址3:http://localhost:3003
这个时候你创建多个不同的axios,是不是就可以轻松解决。
*/
</script>
</html>
//创建 axios 函数对象 a.com b.com let one = axios.create({ baseURL: "http://localhost:8000", method: "GET", timeout: 2000, headers: { class: "H5200318" } }); one({ url:"/server" }).then(response => { console.log(response); }) one.get('/server').then(respones=>{ console.log(respones); }) // let two = axios.create({ // baseURL: "http://b.com:8000/server", // method: "GET", // timeout: 2000, // headers: { // class: "H5200318" // } // });
原文链接:https://blog.csdn.net/JEFF_luyiduan/java/article/details/103295801