vue--代理方式跨域

Posted 2020-11-15 zjt-blogs

正向代理与反向代理

前端使用代理主要用于跨域请求，

关于跨域：常用的方式

• JSONP：利用script标签可跨域的特点，在跨域脚本中可以直接回调当前脚本的函数。

• CORS：服务器设置HTTP响应头中Access-Control-Allow-Origin值，解除跨域限制    

但是这两个跨域方案都存在一个致命的缺陷，严重依赖后端的协助，

代理 就可以作为 前端独立解决跨域的方案

正向代理

是指一个位于客户端和目标服务器(target server)之间的服务器，为了从目标服务器取得内容，客户端向代理发送一个请求并指定目标(目标服务器)，然后代理向目标服务器转交请求并将获得的内容返回给客户端。

 　　vue-cli 3.x  新建vue.config.js文件

module.exports = {
    devServer: {
        proxy: {
            // proxy all requests starting with /api to jsonplaceholder
            ‘/api‘: {
                target: ‘http://localhost:8080‘,   //代理接口
                changeOrigin: true,
                pathRewrite: {
                    ‘^/api‘: ‘/mock‘    //代理的路径
                }
            }
        }
    }
}

反向代理

反向代理（Reverse Proxy）是指以代理服务器来接受internet上的连接请求，然后将请求转发给内部网络上的服务器，并将从服务器上得到的结果返回给internet上请求连接的客户端，此时代理服务器对外就表现为一个反向代理服务器。

 

https://www.cnblogs.com/softidea/p/7425894.html