我是VueJs新手，我正在寻找在VueJs中为Get、Post和Patch配置全局头的最佳方法，即easy to use and strong security.在目前的情况下，我只写了export default {}个组件，我知道这很糟糕.所以我请你们帮忙.
由于@Hardik Satasiya修复
~/plugins/axios.js
每个组件:
import axios from 'axios'
var api = axios.create({
baseURL: 'http://localhost:8000/api/v1/',
headers: {'Authorization': 'JWT ' + store.state.token}
})
export default api
问题:无法将存储传输到axios.创造，所以store is not defined
是的，使用axios是个好主意，因为它的回购协议是维持的.
您可以使用全局配置进行此操作
import axios from 'axios';
axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
或者best方法是为此创建单独的
instances(如果您同时使用multiple api)
import axios from 'axios';
var myApi = axios.create({
baseURL: 'https://my-domain.com/api/',
timeout: 1000,
headers: {'X-Custom-Header': 'CustomHeader1'}
});
// another api service
var amazonApi = axios.create({
baseURL: 'https://amazon-domain.com/api/',
timeout: 2000,
headers: {'X-Custom-Header': 'CustomHeader2'}
});
export default {
myApi,
amazonApi
}
所以你可以单独使用api而不产生任何冲突.
如果您正在设置auth header，最好不要在实例创建时设置它，而是可以在
ready callback中设置它，这样您就可以从localStorage获取或从第三方获取并设置它.
创建后更改标题的步骤
myApi.defaults.headers.authorization = 'JWT ' + yourToken;
所以你可以从任何部分设置头，当你确定你有令牌，然后你可以使用这个代码来设置头.