跨域问题解决

同源策略是浏览器的基本安全功能,限制了不同源之间的交互。当协议、域名、端口不一致时,会发生跨域问题。解决跨域的方法包括:在后端设置响应头允许跨域、使用Nginx反向代理、利用Node.js的http-proxy模块以及JSONP(主要用于GET请求)。通过这些方式,可以规避同源策略限制,实现前端与后端的跨域通信。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

同源策略(百度百科):(Same origin policy)是一种约定,它是最核心浏览器也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。

同源:协议、域名、端口,都必须一致

违背同源就是跨域

解决方案:

1,设置响应头,允许跨域

    response.setHeader('Access-Control-Allow-Origin','*')

    这个需要在后端处理:

2,本地安装nginx,反向代理

    下载nginx:nginx: download

    在解压目录/conf/nginx.conf文件中进行配置

    举个栗子:

    (1)测试前端页面地址为:http://127.0.0.1:5500/code/17ajax/1-GET.html

    (2)测试express服务:http://127.0.0.1:9000/server

     nginx.conf文件配置如图,这样都反向代理到了http://127.0.0.1:8080下,这样就不存在跨域了

    在浏览器中访问地址:http://127.0.0.1:8080,即可访问到测试前端页面 

     测试前端页面中ajax请求url为:http://127.0.0.1:8080/server

     测试访问结果ok:

 3,Node.js配合node-http-proxy

    这个还没有试,我用的nginx

4,jsonp(GET请求)

    理解:前端声明好一个函数,后端返回执行函数,执行函数参数中携带所需的数据

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值