【跨域·配置代理】

什么是跨域

跨域:协议、域名、端口号不同请求,称之为跨域
如果不能更改服务器,用代理
如果能改,浏览器支持CORS用 CORS,不支持用JSOPN
JSOPN发送不了post请求

传统方法:JAOPN,CROS,代理

代理:配置vite或者webpack

webpack

在vue.config.js中配置(webpack.config.js)
注意:proxy一定要写在 devServer里面

module.exports = {
devServer:{
proxy:{
'/api'{//tocathost:3000
target: "http://localhost:8080",
pathRewrite:{ "^/api": "" },
      },
    },
  },

进度条

安装插件
cnpm install --save nprogress

//进度条开始
nprogress.start();
//进度条结束
nprogress.done();

  • 23
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Nginx代理跨域配置是指设置Nginx服务器,使其可以代理跨域请求。跨域请求是指在浏览器中从一个网站请求不同源的资源,这样的请求会被浏览器阻止,因为浏览器的同源策略限制了这样的请求。Nginx代理跨域配置可以绕过这个限制。 具体的配置方法如下: 1. 在Nginx的配置文件中增加以下内容: ``` location /api/ { proxy_pass http://api.example.com/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS'; add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type'; } ``` 2. 上述代码中的/api/是你的本地虚拟路径,http://api.example.com/是你的目标网站地址,在代理的时候要将api.example.com替换成你自己的地址。 3. 设置header的内容,Access-Control-Allow-Origin是设置允许跨域请求的来源地址,可以是*,也可以是具体的域名或IP地址。Access-Control-Allow-Methods是设置允许跨域请求的HTTP方法,如GET、POST等。Access-Control-Allow-Headers是设置允许跨域请求的自定义header,需要根据实际情况进行设置。 4. 完成上述步骤后,重新启动Nginx服务器即可生效。 Nginx代理跨域配置能够有效解决跨域请求的问题,同时也能提高网站的安全性。但需要注意的是,如果设置允许跨域请求的来源地址为*,会造成安全隐患,最好还是根据具体情况设置具体的来源地址。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值