Proxy settings in the browser debugging environment

Under the browser front-end development debugging environment, you need to configure the proxy localhost interface to the actual background: The following is the configuration scheme with different tools:

vue Project: vue.config.js

module.exports = {
  publicPath: './',
  outputDir: 'dist',
  assetsDir: 'static',
  devServer: {
    open: true, // 自动打开浏览器
    host: '0.0.0.0',
    port: 8080,
    hot: true,
    disableHostCheck: true, //  解决host报错问题
    proxy: {
      //配置跨域
      '/api': {
        //解：当请求 /api 时就会代理到 http://srv.cs.cmmurl.cn:28080/api 请求
        target: 'http://srv.cs.cmmurl.cn:28080/',
        changeOrigin: true, // 允许跨域
        secure: true, //允许https请求
      }
    }
  }
}

Use webpack building projects: webpack.dev.config.js

const merge = require('webpack-merge');
const webpack = require('webpack');
const commonConfig = require('./webpack.common.config');

module.exports = merge(commonConfig, {
    mode: 'development',
    devServer: {
        port: 9000,
        hot: true,
        host: 'localhost',
        compress: true,
        open: true,
        historyApiFallback: {
            index: '/my-invoice/index.html'
        },
        publicPath: '/my-invoice/',
        proxy: {
            '/invoice': {
                target: 'https://my-invoice.cs.cmmurl.cn:28443/',
                changeOrigin: true,
                secure: false,
            },
        },
        disableHostCheck: true,
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify('development'),
        }),
    ],
});