常见前端开发面试题（http部分）

跨域有哪几种方式

1.jsonp跨域
2.CORS跨域资源共享
3.iframe标签跨域
4.在webpack中通过配置devServer的方式跨域
5.通过集成环境（本地模拟服务器， apache或者tomcat）跨域
6.使用chrome浏览器插件跨域

如果是在小程序中，需要配置你的https服务器白名单。

cookies，sessionStorage和localStorage的区别

首先共同点：这三个都储存在用户本地。
区别：cookie有个数和大小限制（50个/4kb）。删除的时候需要通过设置过期时间来删除。
sessionStorage和localStorage是html5中新增加的用于用户本地数据持久化的解决方案，用于替代cookie。
这俩单一条数据的储存空间可以达到5M，但是sessionStorage的生命周期只存在于你浏览器打开的时候，
当你关闭的时候sessionStorage会自动清除。
localStorage则不受限制，在设置以后，需要通过clear方法删除。

vue-router query和params传参有什么区别

首先我们知道vueroute传参其实走的就是url中的post和get。
如果是query，表示get，你的参数会用明文的形式保存在浏览器地址中，这样用户会看到参数，可能会对安全性上造成一些隐患。但是，
这样做有一个好处就是，当用户刷新浏览器的时候，参数依然存在。你的相应页面不会因为参数的丢失导致错误。
如果是params，表示post，你的参数不会显示在浏览器地址中，用户看不到参数，只有你接收的页面通过$route.params.参数名来接收。好处是，安全性能高，缺点是这个参数保存在内存中，你一旦刷新页面就不存在了。

前后端分离如何保护数据传输安全性

通过token，在ajax请求中把token添加到headers上。

如何处理ajax常见错误

ajax有一个error属性，比如:

$.ajax({
    type:"get",
    url:url,
    success:function (res) {
        //...
    }),
    error: function (err) {   //ajax请求失败时返回   返回的err是一个对象
        if(err.status>=400&&err.status<500){
           window.location.href="./404.html"
        }else if(err.status>=500&&err.status<600){
           window.location.href="./500.html"
        }else{
            alert(err.status + '(' + err.statusText + ')');  
            //返回ajax请求失败的值   如(404  not find)  让用户知道是请求报错了 
        }
    }
}});

ajax失败以后会返回一个error对象，这个error对象有一个status属性，就是返回的错误值。
我们可以在这里为用户制作几个错误页面，或者让用户跳转回首页。