On the cross domain configuration of browsers in vue project

1. What is cross-domain
When a request for url protocol, domain name, port between any one of the three different from the current page url is cross-domain.

2. Homologous strategy
Homologous policy (Same origin policy) is a convention, which is the core and basic security function of browser. If there is no homologous policy, the normal function of browser may be affected. It can be said that Web is built on the basis of homologous policy, and browser is only one implementation of homologous policy.

3. Configure in the project
Open the project to find index. js under config file, and configure cross-domain in js proxyTable. The code is as follows

 proxyTable: {
   '/api': {
     target: 'http://***.com',// You want a cross-domain URL 
    secure: true, 
    changeOrigin: true,
    pathRewrite: {
     '^/api': '/api'
    }
   }
  }

target: You want a cross-domain URL
secure: This parameter needs to be configured if it is an https interface
changeOrigin: This parameter is used to avoid cross-site problems. After configuration, host in http and header will be modified automatically, but nothing else will be modified.
pathRewrite: Rewrite
"'^/api': '/api'" The configuration here is a regular expression, and those beginning with/api will be replaced with '/api' if the interface of the background document is/api/list/xxx
The front-end api interface writes: axios. get ('/api/list/xxx'), and the actual access after processing is: http://news.baidu.com/api/list/xxx

Summarize