In the development environment and back-end debugging, you will inevitably encounter cross-domain problems. Many people say that cross-domain solutions are just solved by the back-end.
In fact, there are many ways to solve cross-domain front-end, which is convenient and fast.
Common ones are nginx forwarding and node proxy.
ProxyTable is commonly used in vue projects, which is very convenient to use.
Open index.js under config, find proxyTable, and add the following code:
'/api': {//Replace proxy address name
target: ' http://api.douban.com/ ', //Proxy address
changeOrigin: true, //Can cross domain
pathRewrite: {
'^/api':' '//Rewrite the interface, remove /api
}
}
After configuration, you need to restart the next project npm run dev
After restarting, you can call to achieve cross-domain
Specific use:
Just add "/api" before the interface to be called
Not surprisingly, after clicking the button, the console will print the return result
In order to facilitate the removal of'/api' after packaging, it is recommended to set'/api' to global and add it in main.js
Vue.prototype.api = process.env.NODE_ENV ==='production'?'':
The url when calling the interface with '/api' can be written as api +'interface address' and
this is the end, I hope it helps.