请选择 进入手机版 | 继续访问电脑版

阿里面试题整理(其二)

[复制链接]
小甜心 发表于 2021-1-1 18:34:09 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
http2 和 1 的区别



  • 欣赏器与服务器通信过程

    • TCP 毗连: 欣赏器与服务器三次握手,创建 TCP 毗连
    • 客户端请求: 创建 TCP 毗连后,客户端就会向服务器发送一个 HTTP 请求信息(比如请求 HTML 资源,我们暂且就把这个称为“ HTML 请求”)
    • 服务器响应: 服务器接收到请求后举行处理并发回一个 HTTP 响应信息

  • HTTP/1

    • 每完成一次请求和响应,TCP 毗连就会断开,因为 TCP 毗连会有 RTT(Round Trip Time, 往返时间),每请求一个资源就要有一次 RTT,所有需要加载资源比较多得网站会打开很慢。

  • HTTP/1.X

    • TCP 可以长期毗连,一次 TCP 毗连要比及同域名下的所有资源请求/相应完毕了毗连才会断开,节约请求的时间。
    • HTTP1.x 在使用时,header 里携带的内容过大,增加了传输的本钱,在移动端增加用户流量。

  • HTTP/2

    • HTTP/2 接纳二进制格式而非文本格式
    • HTTP/2 是完全多路复用的,而非有序并阻塞的——只需一个毗连即可实现并行
    • 使用报头压缩,HTTP/2 低沉了开销
    • HTTP/2 让服务器可以将响应主动“推送”到客户端缓存中

  • HTTPS 与 HTTP 的一些区别

    • HTTPS 协议需要到 CA 申请证书,一般免费证书很少,需要交费。
    • HTTP 协议运行在 TCP 之上,所有传输的内容都是明文,HTTPS 运行在 SSL/TLS 之上,SSL/TLS 运行在 TCP 之上,所有传输的内容都颠末加密的。
    • HTTP 和 HTTPS 使用的是完全差别的毗连方式,用的端口也不一样,前者是 80,后者是 443。
    • HTTPS 可以有效的防止运营商挟制,管理了防挟制的一个大问题。

跨域管理方案

完整版:(https://juejin.cn/post/6844903767226351623)


  • 首先说明 3 个问题:

    • 如果是协议和端口造成的跨域问题“前台”是无能为力的。
    • 在跨域问题上,仅仅是通过“URL 的首部”来识别而不会根据域名对应的 IP 地点是否相同来判断。“URL 的首部”可以明白为“协议, 域名和端口必须匹配”。
    • 跨域并不是请求发不出去,请求能发出去,服务端能收到请求并正常返回效果,只是效果被欣赏器拦截了。

  • 同源战略限制内容有:

    • Cookie、LocalStorage、IndexedDB 等存储性内容
    • DOM 节点
    • AJAX 请求发送后,效果被欣赏器拦截了

  • 但是有三个标签是允许跨域加载资源:

    • img src=XXX
    • link href=XXX
    • script src=XXX

  • 常见跨域场景

    • 当协议、子域名、主域名、端标语中任意一个不相同时,都算作差别域。

  • 管理方案

    • 通过 JSONP

      • JSONP 优点是简单兼容性好,可用于管理主流欣赏器的跨域数据访问的问题。缺点是仅支持 get 方法具有范围性,不安全大概会遭受 XSS 攻击。

    • CORS

      • CORS 需要欣赏器和后端同时支持。IE 8 和 9 需要通过 XDomainRequest 来实现。

    • postMessage

      • postMessage 是 HTML5 XMLHttpRequest Level 2 中的 API,且是为数不多可以跨域操作的 window 属性之一,它可用于管理以下方面的问题:

        • 页面和其打开的新窗口的数据通报
        • 多窗口之间消息通报
        • 页面与嵌套的 iframe 消息通报
        • 上面三个场景的跨域数据通报


    • websocket

      • Websocket 是 HTML5 的一个长期化的协议,它实现了欣赏器与服务器的全双工通信,同时也是跨域的一种管理方案。WebSocket 和 HTTP 都是应用层协议,都基于 TCP 协议。

    • Node 中间件代理

      • 同源战略是欣赏器需要遵循的尺度,而如果是服务器向服务器请求就无需遵循同源战略。 代理服务器,需要做以下几个步骤:

        • 继承客户端请求 。
        • 将请求 转发给服务器。
        • 拿到服务器 响应 数据。
        • 将 响应 转发给客户端。


    • nginx 反向代理

      • 实现原理类似于 Node 中间件代理,需要你搭建一个中转 nginx 服务器,用于转发请求。

    • window.name + iframe
    • location.hash + iframe
    • document.domain + iframe

  • 总结

    • CORS 支持所有范例的 HTTP 请求,是跨域 HTTP 请求的根本管理方案
    • JSONP 只支持 GET 请求,JSONP 的优势在于支持老式欣赏器,以及可以向不支持 CORS 的网站请求数据。
    • 不管是 Node 中间件代理照旧 nginx 反向代理,主要是通过同源战略对服务器不加限制。
    • 日常工作中,用得比较多的跨域方案是 cors 和 nginx 反向代理

欣赏器为什么要阻止跨域?

同源战略/SOP ( Same origin policy )是一种约定,由 Netscape 公司 1995 年引入欣赏器,它是欣赏器最核心也最基本的安全功能,如果缺少了同源战略,欣赏器很容易受到 XSS、CSFR 等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个差别的域名指向同一个 ip 地点,也非同源。
xss 攻击如何制止

完整版:(https://tech.meituan.com/2018/09/27/fe-security.html)


  • 使用模板引擎 开启模板引擎自带的 HTML 转义功能
  • 制止内联事件 在 JavaScript 中通过 .addEventlistener() 事件绑定会更安全。
  • 制止拼接 HTML 前端接纳拼接 HTML 的方法比较危险,如果框架允许,使用 createElement、setAttribute 之类的方法实现。或者接纳比较成熟的渲染框架,如 Vue/React 等。
  • 在插入位置为 DOM 属性、链接等位置时,要打起精神,严加防范。
  • 通过 CSP、输入长度配置、接口安全步伐等方法,增加攻击的难度,低沉攻击的效果。
  • 可使用 XSS 攻击字符串和自动扫描工具寻找潜在的 XSS 弊端。
如何优化首屏时间?除了 SSR 摆设,另有什么别的管理方案?



  • 服务端渲染
  • 首屏内容静态缓存(pretender spa plugin)
  • 图片懒加载
  • 无法制止白屏的时候使用加载占位图
数组跳跃



  • 输入: [2,3,1,1,4]
  • 输出: 2
  • 表明: 跳到最后一个位置的最小跳跃数是 2。 从下标为 0 跳到下标为 1 的位置,跳  1  步,然后跳  3  步到达数组的最后一个位置。
  1. var jump = function (nums) {        // 界说一个轮询方法,传入原始数组,当前下标,跳跃的步数统计。        function one(num, start, step) {                // 截取当前下标以及当前下标可以或许跳跃到的数组段落。                let arr = num.slice(start, start + num[start] + 1)                // 如果当前下标已经在最后了,返回步数。                if (arr.length == 1) {                        return step                }                // 如果当前下标是0,那么返回无法跳跃。                if (arr[0] === 0) {                        return false                }                // 如果当前下标可以或许一次性跳跃到原始数组末端,返回步数+1。                if (arr[0] + start >= num.length - 1) {                        return step + 1                }                // 界说最大值,一次跳跃了几个。                let max = 0                let jump = 0                arr.forEach((item, index) => {                        if (item + index > max) {                                max = item + index                                jump = index                        }                })                // 如果一次跳跃了0个,返回无法跳跃。                if (jump === 0) {                        return false                        // 否则,将跳跃后的效果继续传入方法中,步数+1。                } else {                        return one(num, jump + start, step + 1)                }        }        return one(nums, 0, 0)}
复制代码
来源:https://blog.csdn.net/qq_40289624/article/details/112008243
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则


专注素材教程免费分享
全国免费热线电话

18768367769

周一至周日9:00-23:00

反馈建议

27428564@qq.com 在线QQ咨询

扫描二维码关注我们

Powered by Discuz! X3.4© 2001-2013 Comsenz Inc.( 蜀ICP备2021001884号-1 )