鹅厂TME的web前端面试题这些都会吗?

837 阅读4分钟

创意时尚商务面试课程培训首图1.png

2020年变动颇大的一年,A国制裁恰遇新型冠状疫情,作为一位双非本科且非计算机专业的同学,有幸参加腾讯音乐的面试,202008251744开始进行前端面试,需求减少要求肯定随之提高,谨以此面经献给在如此艰难之时逆风而动、勇敢坚强的你~

性能优化

参考前端性能优化总结

缓存

面试精选之http缓存

http协议

「查缺补漏」巩固你的HTTP知识体系

https

谈谈 HTTPS

前端安全防范措施?xss攻击和csrf攻击

前端安全知识

Ajax原理知识

Ajax原理一篇就够了

跨域的处理方式

跨域总结

但是面试官提到了可以请求方式使用使用option进行跨域请求

在正式跨域的请求前,浏览器会根据需要,发起一个“PreFlight”(也就是Option请求),用来让服务端返回允许的方法(如get、post),被跨域访问的Origin(来源,或者域),还有是否需要Credentials(认证信息)

三种场景:

  1. 如果跨域的请求是Simple Request(简单请求 ),则不会触发“PreFlight”。Mozilla对于简单请求的要求是: 以下三项必须都成立:
  2. 只能是Get、Head、Post方法
  3. 除了浏览器自己在Http头上加的信息(如Connection、User-Agent),开发者只能加这几个:Accept、Accept-Language、Content-Type、。。。。
  4. Content-Type只能取这几个值: application/x-www-form-urlencoded multipart/form-data text/plain

一、为什么会出现options请求呢?

跨域请求中,options请求是浏览器自发起的preflight request(预检请求),以检测实际请求是否可以被浏览器接受。

preflight request请求报文中有两个需要关注的首部字段:

(1)Access-Control-Request-Method:告知服务器实际请求所使用的HTTP方法;

(2)Access-Control-Request-Headers:告知服务器实际请求所携带的自定义首部字段。

同时服务器也会添加origin header,告知服务器实际请求的客户端的地址。服务器基于从预检请求获得的信息来判断,是否接受接下来的实际请求。

服务器所返回的Access-Control-Allow-Methods首部字段将所有允许的请求方法告知客户端,返回将所有Access-Control-Request-Headers首部字段将所有允许的自定义首部字段告知客户端。此外,服务器端可返回Access-Control-Max-Age首部字段,允许浏览器在指定时间内,无需再发送预检请求,直接用本次结果即可。

在我们开发过程中出现的浏览器自发起的options请求就是上面的第二种情况。实际上,跨域请求中的”复杂请求”发出前会进行一次方法是options的preflight request。

二、当跨域请求是简单请求时不会进行preflight request,只有复杂请求才会进行preflight request。

跨域请求分两种:简单请求、复杂请求;

符合以下任一情况的就是复杂请求:

1.使用方法put或者delete;

2.发送json格式的数据(content-type: application/json)

3.请求中带有自定义头部;

除了满足以上条件的复杂请求其他的就是简单请求喽!

三、为什么跨域的复杂请求需要preflight request?

复杂请求可能对服务器数据产生副作用。例如delete或者put,都会对服务器数据进行修改,所以在请求之前都要先询问服务器,当前网页所在域名是否在服务器的许可名单中,服务器允许后,浏览器才会发出正式的请求,否则不发送正式请求。

队列、栈、斐波那契数列

前端应该了解的数据结构-栈与队列

一道算法题 Leetcode 20.有效的括号(遇到两次)

  • 题目描述:
给定一个只包括 '('')''{''}''['']' 的字符串,判断字符串是否有效。有效字符串需满足:
左括号必须用相同类型的右括号闭合。
左括号必须以正确的顺序闭合。
注意空字符串可被认为是有效字符串。

示例 1:
输入: "()"
输出: true

示例 2:
输入: "()[]{}"
输出: true

示例 3:
输入: "(]"
输出: false

示例 4:
输入: "([)]"
输出: false

示例 5:
输入: "{[]}"
输出: true

答案参考

/**
 * @param {string} s
 * @return {boolean}
 */
var isValid = function(s) {
    var rightSymbols = [];
    for (var i = 0; i < s.length; i++) {
        if(s[i] == "("){
            rightSymbols.push(")");
        }else if(s[i] == "{"){
            rightSymbols.push("}");
        }else if(s[i] == "["){
            rightSymbols.push("]");
        }else if(rightSymbols.pop() != s[i] ){
            return false;
        }
    }
    return !rightSymbols.length;
};

来源:力扣(LeetCode)有效的括号