[Vue] - Agent way across domains

Forward Proxy and Reverse Proxy

Mainly used for front-end cross-domain request agent,

About cross-domain: common approach

• JSONP: using the script tag can be cross-domain characteristics, in cross-domain script can direct the callback function of the current script.

• CORS: Set server HTTP Access-Control-Allow-Origin header value in response, release the cross-domain restrictions    

But these two cross-domain schemes there is a fatal flaw, rely heavily on back-end assistance

Agent can be used as a front end to independently solve cross-domain solutions

Forward Proxy

Refers to a server located between the client and the target server (target server), in order to obtain the target content from the server, the client transmits a request to the proxy and specify the target (destination server), and then transmit the request to the proxy server and to obtain the target content back to the client.

 　　vue-cli 3.x New vue.config.js file

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

Reverse Proxy

Reverse proxy (Reverse Proxy) refers to the proxy server to accept connection requests on the internet, and then forward the request to the server on the internal network, and the results obtained from the server back to the requesting client on the internet connection, this when the external proxy server on the performance of a reverse proxy server.

 

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