window.location.href 和axios的区别
时间: 2023-12-20 11:32:34 浏览: 52
window.location.href 和 axios 是两个不同的概念和用途。
window.location.href 是 JavaScript 中的一个属性,用于获取或设置当前页面的 URL 地址。通过设置该属性,可以实现页面的跳转或重定向。例如,通过设置 window.location.href = "http://localhost/lee/yxlego/view/picture.php" 可以将当前页面跳转到指定的 URL 地址。
axios 是一个基于 Promise 的 HTTP 客户端,用于在浏览器和 Node.js 中发送 HTTP 请求。它提供了简洁的 API,可以轻松地发送 GET、POST、PUT、DELETE 等请求,并处理响应数据。使用 axios 可以方便地与后端服务器进行数据交互,例如获取数据、提交表单等操作。
总结起来,window.location.href 主要用于页面跳转和重定向,而 axios 主要用于发送 HTTP 请求和处理响应数据。
相关问题
axios拦截器判断toke是否过期怎么做function (request) { const token = window.localStorage.getItem("poying_access_token"); request.headers.Authorization = request?.headers?.Authorization ?? (Bearer ${token} || ""); if (!whiteList.some((d) => d === request.url) && !token) { window.location.href = "/login"; } return request; }, function (error) { return Promise.reject(error); } );
这段代码中,使用了axios的请求拦截器,在请求发出前进行token的判断。具体的做法是从本地存储中获取token,然后将token添加到请求头的Authorization字段中。如果请求的url不在白名单中并且没有token,则跳转到登录页面。最后,将请求对象返回,使请求继续发送出去。
如果token过期了,可以通过后端返回的状态码或错误信息来判断,然后在响应拦截器中进行处理。例如,如果后端返回401状态码或者错误信息中包含token过期的字样,那么可以在响应拦截器中进行token刷新或者跳转到登录页面。具体的做法可以参考下面的代码:
```
axios.interceptors.response.use(
function (response) {
return response;
},
function (error) {
if (error.response.status === 401 || error.response.data.includes('token expired')) {
// 进行token刷新或跳转到登录页面
// ...
}
return Promise.reject(error);
}
);
```
<select v-model="subclass" @change="onSelectSub" onblur="size=0" onmousedown="if(options.length>3){size=4}"onchange="size=0" class="select-frame"> <option v-for="(option,index) in options1" :key="index" :value="option.value">{{option.label}}</option> </select> onSelectSub(){ console.log(this.subclass) axios.get("http://localhost:9091/Classification/selectOrderBySuborder/"+this.subclass).then(function (response){ console.log(this.subclass) console.log(response.data); // if(response.data){ // alert("修改成功"); // window.location.href = 'login.html'; // } this.options2=response.data; }).catch(function (error){ console.log(error) })
这段代码是关于前端页面的一个下拉选择框,选中其中一个选项后,将会调用onSelectSub方法。在该方法中,会使用axios库向后端发送一个get请求,并传递一个参数this.subclass。请求成功后,会将返回的数据赋值给options2,用于更新下拉框中的选项。其中,console.log用于输出相关信息以进行调试。