解决跨域问题的几个方法

跨域

一般来说,前后端代码都部署到同一个服务器的话,不会跨域。但是在部署之前,代码调试(联调)时,有时候前后端在不同的域(协议/域名/端口)下,需要解决跨域问题

cors(最简单,只需要后端配置)

// 写在后端代码里,列如php:
// 指定允许其他域名访问  (必写)
header('Access-Control-Allow-Origin:*');
// 响应类型  
header('Access-Control-Allow-Methods:POST');
// 响应头设置  (必写)
header('Access-Control-Allow-Headers:x-requested-with,content-type');

proxy(前端项目里配置)

proxy(代理):代理及中间人,是给客户端(正向)或服务端(反向)办事的,包括正向代理和反向代理正向代理配置于客户端,常常用于访问内网访问外网/提高速度/隐藏真实客户端的Ip;反向代理配置于服务端,通过配置的地址路径(可跨域),把请求分配到不同的服务器,常常用于负载均衡/跨域/提高速度/隐藏真实服务器的ip

所以用于跨域的proxy(代理)是反向代理

// 写在脚手架的配置文件里,如vue项目,在根目录下的vue.config.js
module.exports={
    devServer:{
        proxy:{
            "/api":{
                target:"http://www.weather.com.cn/",
                changeOrigin:true,
                pathRewrite:{
                    "^/api":""
                }
            }
        }
    }
}
// 注意:
// 1. "/api"会被重写成""
// 2. target是目标路径
// 3. 项目必须重启!

jsonp

// 没怎么用过

更多详细内容请看:点我跳转

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值