
1) 【一句话结论】在大数据平台前后端分离架构中,跨域解决方案的选择需结合API类型(如数据查询、数据导出)和业务需求,CORS适用于标准HTTP请求(如GET/POST数据查询),JSONP仅支持GET且需自定义,代理服务器适用于跨域且需转发复杂请求(如文件导出),需根据请求类型、安全性、性能等综合判断。
2) 【原理/概念讲解】
老师口吻解释:
OPTIONS预检请求(类似“申请函”),服务器返回包含Access-Control-Allow-Origin等HTTP头,浏览器根据头判断是否允许发送实际请求。类比:跨部门沟通需先发“授权申请”,获得同意后再正式提交。<script>标签,拼接回调函数名和请求数据,利用<script>不受同源策略限制的特性实现跨域。类比:用“隐藏通道”(<script>标签)传递数据,绕过同源限制。3) 【对比与适用场景】
| 方案 | 定义 | 特性 | 使用场景 | 注意点 |
|---|---|---|---|---|
| CORS | 跨域资源共享,浏览器与服务器协商允许跨域请求 | 服务器返回HTTP头(如Access-Control-Allow-Origin),浏览器根据头判断是否允许 | 数据查询(如GET/POST获取数据)、大数据API的实时数据请求 | 需服务器支持预检请求(OPTIONS),处理不当可能导致405错误 |
| JSONP | 通过动态创建<script>标签,拼接回调函数实现跨域数据传输 | 仅支持GET请求,需自定义回调函数,数据格式为回调函数名(数据) | 数据导出(如生成Excel/CSV文件,需返回文件流)、简单数据获取(如GET请求) | 限制为GET,无法处理POST等复杂请求,安全性较低(易被XSS攻击) |
| 代理服务器 | 前端请求代理服务器,代理服务器转发请求至后端,返回数据给前端 | 隐藏后端真实地址,支持所有HTTP方法,可处理文件下载等复杂请求 | 跨域且需转发文件导出、复杂请求(如POST带文件)、需要隐藏后端IP | 增加网络延迟,需维护代理服务器,缓存策略需考虑 |
4) 【示例】
数据查询(CORS场景):
前端请求:https://api.bigdata.com/v1/query?params=...
后端返回:Access-Control-Allow-Origin: https://client.com
浏览器直接发送GET请求,成功获取JSON数据。
数据导出(代理服务器场景):
前端请求:https://proxy.bigdata.com/export?dataId=123
代理服务器转发:https://api.bigdata.com/v1/export?dataId=123
后端返回文件流(如Excel),代理服务器将文件流返回给前端,前端下载文件。
5) 【面试口播版答案】
在大数据平台前后端分离中,跨域方案主要分CORS、JSONP、代理服务器。CORS通过服务器返回跨域头允许跨域,适用于数据查询这类标准HTTP请求;JSONP用<script>标签绕过同源,仅支持GET,适合简单数据导出;代理服务器是前端请求中间人,转发后端请求,适合文件导出等复杂场景。比如数据查询用CORS,因为GET请求直接发送,服务器返回允许头即可;数据导出需要文件流,用代理服务器转发,隐藏后端地址。总结,选择依据是API类型(查询/导出)、请求方法(GET/POST)、安全性(CORS更安全,JSONP易被攻击)和性能(代理增加延迟)。
6) 【追问清单】
handleData),请求URL拼接回调函数名和请求数据(如handleData({data: ...})),后端返回handleData({data: ...}),浏览器执行回调函数。7) 【常见坑/雷区】
Access-Control-Allow-Origin设置错误,导致请求被浏览器拦截。