前端配置代理解决跨域问题

跨域问题:跨域是由浏览器同源策略引起的,是指页面请求的接口地址,必须与页面url地址处于同域上(即域名,端口,协议相同)。这是为了防止某域名下的接口被其他域名下的网页非法调用,是浏览器对JavaScript施加的安全限制。

注意:这个叫域名  

在项目开发过程中,会给前端开发者造成一定的问题: 

由于页面开发中,是放在本地电脑上的调试的,访问的话通常通过IP方式(127.0.0.1)或者localhost来访问,与线上服务器所在域名不符,不能顺利进行接口调用。

解决跨域问题常用的解决方案有两个:

  • JSONP:利用script标签可跨域的特点,在跨域脚本中可以直接回调当前脚本的函数。
  • CORS:服务器设置HTTP响应头中Access-Control-Allow-Origin值,解除跨域限制。

缺点:严重依赖后端

前端独立解决接口跨域问题:代理和反向代理

代理是指一个位于客户端目标服务器(target server)之间的服务器

代理数据流程:

  • 数据请求过程:浏览器-》代理服务器-》目标服务器
  • 数据返回过程:目标服务器-》代理服务器-》浏览器

反向代理数据流程:

  • 数据请求过程:浏览器-》【反向代理服务器-》处理数据的服务器】
  • 数据返回过程:【处理数据的服务器-》反向代理服务器】-》浏览器

代理配置只在本地调试,项目部署时发挥作用 

还有一个问题:更改了 配置文件 比如代理 为什么需要重新跑项目捏?

项目运行,其实是终端输入命令,启动node服务,node只有在第一次引用某部分时才会去解析脚本文件,以后都会直接访问内存,避免重复载入。

摘:

javascript - 前端开发如何独立解决跨域问题 - 原创小文章 - SegmentFault 思否

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值