How to implement cross-domain requests in the vue-cli development environment

This article mainly introduces the method of implementing cross-domain requests in the vue-cli development environment. Now I will share it with you and give you a reference.

During front-end development, requests to the backend interface often need to be cross-domain. To implement cross-domain requests with vue-cli, you only need to open config/index.js and modify the following content.

//例如要请求的接口url为http://172.3.2.1:8000/look/1

module.exports = {
  dev:{
    proxyTable:{
      '/api':{
        target: 'http://172.3.2.1:8000',
        changeOrigin: true,
        pathRewrite: {
         '^/api': ''
        }
      }
    }
  }
}

At this time, enter /api/look/1 at the URL of the interface you want to request to achieve cross-domain requests.

If you open F12 at this time, you will find that the requested url is localhost:8080/api/look/1. This is actually a virtual request for data from the local, so that there will be no cross-domain problems.

Under normal circumstances, there is no problem with the above method. If the above method does not work, you can try writing like this:

//例如要请求的接口url为http://172.3.2.1:8000/look/1

module.exports = {
  dev:{
    proxyTable:{
      '/look':{
        target: 'http://172.3.2.1:8000',
        changeOrigin: true,
        pathRewrite: {
         '^/look': '/look'
        }
      }
    }
  }
}

above I compiled it for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Ajax method of reading properties resource file data

Ajax method to achieve regular update of a page block Content method

Ajax method to obtain response content length

##

The above is the detailed content of How to implement cross-domain requests in the vue-cli development environment. For more information, please follow other related articles on the PHP Chinese website!