<template> <div> <router-view/> </div> </template> <script> import axios from 'axios'; let protocol = window.location.protocol; //协议 let host = window.location.host; //主机 let reg = /^localhost+/; if(reg.test(host)) { //若本地项目调试使用 axios.defaults.baseURL = 'http://10.0.xx.xxx:xxxx/api/'; } else { //动态请求地址 axios.defaults.baseURL = protocol + "//" + host + "/api/"; } axios.defaults.timeout = 30000; export default { name: 'app', axios //这里记得导出，若请求地址永久固定一个，则就按照`普通版`配置一个baserURL就可以了 } </script> <style lang="scss"> //这里我使用的是scss @import '~@/style/style' </style>
总结
常见问题
在使用动态版时，为什么称为动态呢，是因为访问地址和请求地址是同一个地址可端口号，例如我通过(默认端口80)访问项目，那么我的baseURL会自动的变为http::80/api/，这么做的原因是当某一天项目迁移或者http改为https时，不用你再去更改请求地址，程序自动就完成了
数据请求地址配置不正确？如果你配置了baseURL，那么你封装的函数在使用时仅需传入基于baseURL的请求地址，例如传入login/那么请求地址会自动变为http::80/api/login/，若未配置，那么可以直接传入整个请求地址
注意事项
在使用动态版时，由于没有使用拦截器，所以下面封装的函数在返回错误的时候需要写成err.response.data来获取返回的数据，但我写的是err.response，因为这样可以拿到(status)状态码等信息，若不需要判断返回的状态码，则改为err.response.data便可
好了，以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
您可能感兴趣的文章: