Vue2面试题:说一下对跨域的理解?

发布时间:2023年12月20日

? ? http请求分为两大类:普通http请求(如百度请求)和ajax请求(跨域是出现在ajax请求)

? ? 同源策略:在浏览器发起ajax请求时,当前的网址和被请求的网址协议、域名、端口号必须完全一致,目的是为了防止跨站脚本攻击。

? ? 跨域是浏览器的同源策略导致的,而服务器之间不受同源策略影响!!!

前端本地开发存在跨域,但前端部署到服务器上就不存在跨域了!!!

??? 解决方式:

? ? ? ? 1、CORS跨域资源共享

? ? ? ? 在配置类中,添加一个CORS的过滤器,在响应头上添加允许访问的请求源 addAllowedOrigin("*")

? ? ? ? 2、Jsonp

? ? ? ? 利用srcipt标签的src属性来实现,前端声明好一个函数,后端返回执行函数,执行函数参数中携带所需的数据。

? ? ? ? 可以使用jquery的ajax快速实现Jsonp。

? ? ? ? 使用jsonp只能解决get请求的跨域,因为script标签中的src请求就是get请求。

? ? ? ? 3、vue脚手架正向代理

? ? ? ? 跨域解决:vue脚手架自动在本地开启一个基于node的代理服务器,IP和端口号与本地浏览器相同

? ? ? ? 浏览器【http://localhost:8080】 -> 本地代理服务器【http://localhost:8080】 -> 目标服务器【http://47.94.222.12:8080】

? ? ? ? 4、Nginx反向代理

? ? ? ? 跨域解决:location配置中,在响应头上添加允许访问的请求源 Access-Control-Allow-Origin:*

? ? ? ? 浏览器【http://localhost:8080】 - Nginx代理服务器【添加放行请求源】 - 目标服务器【http://192.168.0.120:8080】

文章来源:https://blog.csdn.net/m0_74802419/article/details/135096784
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。