JS面试题|[2024-12-31]

1.了解过JWT吗？

JWT(JSON Web Token) ：通过JSON形式作为在web应用中的令牌，可以在各方之间安全的把信息作为JSON对象传输。

作用是：信息传输，授权

JWT的认证流程：

        1.前端把账号密码发送给后端接口

        2.后端核对账号密码成功后，把用户id等其他信息作为JWT负载，把它和头部分分别进行base64编码拼接后签名，形成一个JWT（token）

        3.前端每日请求时会把JWT放在HTTP请求头的Authorization字段内

        4.后端检查是否存在，如果存在就验证JWT的有效性（签名是否正确，token是否过期）

        5.验证通过后，后端使用JWT中包含的用户信息进行其他的操作，并返回对应的结果

优点：简洁、包含性，因为Token是JSON加密的形式保存在客户端，所以JWT是跨语言的，原则上是任何web形式都支持。

2.npm的底层环境是什么？

npm（node package manager）：node的包管理和分发工具，已经成为分发node模块的标准，是JS的运行环境。

npm的组成：网站、注册表、命令行工具

3.HTTP协议规定的请求头和响应头有什么？

1.请求头

        Accept：浏览器所支持的数据类型

        Host：浏览器想访问服务器的哪台主机

        Referer：浏览器是从哪里来的（防盗链）

        User-Agent：浏览器类型、版本信息

        Date：浏览器是什么时候访问的

        Connection：链接方式

2.响应头

        Location：告诉浏览器要去找谁

        Server：服务器的类型

        Content-Type：返回的数据类型

        Refresh：控制了的定时刷新

4.说一下浏览器的缓存策略

强缓存（本地缓存）、协商缓存（弱缓存）

强缓：不发起请求，直接使用缓存里的内容，浏览器把JS,CSS,image等存到内存中，下次用户访问直接从内存中取，提高性能

协缓：需要向后台发请求，通过判断来决定是否使用协商缓存，如果请求内容没有改变，则返回304，浏览器就用缓存里的内容

强缓存的触发：

        HTTP1.0：时间戳响应标头

        HTTP2.0：Cache-Control响应标头

协商缓存的触发：       

        HTTP1.0：请求头 -- if-modified-since 响应头 -- last-modifed

        HTTP2.0：请求头 -- if-none-match 响应头 -- Etag

5.说一下什么是“同源策略”？

http://www.aaa.com:8080/index/vue.js

http -- 协议

www -- 子域名

aaa.com -- 主域名

8080 -- 端口号

vue.js -- 资源

同源策略是浏览器的核心，如果没有这个策略就会遭受网络攻击

主要指的就是 协议+域名+端口号 三者一致，若其中一个不一样则不是同源，会产生跨域

三个允许跨域加载资源的标签：img link script

跨域是可以发送请求，后端也会正常返回结果，只不过这个结果被浏览器拦截了！

解决跨域的方法：1.JSONP 2.CORS 3.websocket 4.反向代理

2024年的最后一天了，提前祝新年快乐，万事顺遂！