Two solutions for cross-domain requests in vue using axios

Recently, I was using vue axios to send requests, but there was a cross-domain problem. I checked a lot on the Internet and found that there are several endings.
1: Set cross-domain
header("Access-Control-Allow-Origin:*");
header("Access-Control-Allow-Headers:content-type");
header("Access-Control-Request-Method: GET,POST");
2: You can set up a proxy server by yourself. I recommend this method to use proxyTable.
First find proxyTable: {} in config/index.js, and then add it

 "/api":{
            target: 'http://47.104.218.122:8087',
            changeOrigin: true,
            pathRewrite: {
                '^/api': '/'
            }
        }

Note that /api is your own, you can write anything. target sets the domain name and port number of the interface you are calling. It is understood here that '^/api' is used to replace the address in the target, and when we call the interface in the following components, we directly use api instead. For example, if I want to call ' http://47.104.218.122:8087/dictionaryType ', just write '/api/dictionaryType' directly.
Then we can set a base path in main.js, so that when you call the interface, you can directly write the / interface name without writing the api. Set axios.defaults.baseURL=”/api” in main.js;
then you can directly write let _url4=”/dictionaryTypes” when the interface is dropped; this will save trouble.

    this.$axios.get(_url4)
                    .then(response=>{
                        alert(response);
                        alert(1);
                    })
                    .catch(error=>{
                        console.log(error);
                    })
 这个是我使用vue 的时候遇到的问题   仅作为参考。 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326205948&siteId=291194637