electron-vue下解决请求跨域方法

electron-vue项目开发下解决请求跨域方法

概要：一般在vue的项目下前端一般常见解决跨域的方法就是在vue.config.js下配置相关代码，但是在开发electron-vue的时候这种方法并不适用，不过原理大差不差。
electron-vue项目在启动时需要执行一个js文件（.electron-vue/dev-runner.js），项目启动的配置都在这个文件里，所以将代理的部分代码在dev-runner.js文件中进行配置

找到startenderer方法，在newWebpackDevServer的方法下添加如下代码片

代码如下：

    const server = new WebpackDevServer(
      compiler,
      {
        contentBase: path.join(__dirname, '../'),
        quiet: true,
        hot: true,
        before (app, ctx) {
          // app.use(hotMiddleware)
          ctx.middleware.waitUntilValid(() => {
            resolve()
          })
        },
        proxy:{
          "/api": {
            //测试服务接口地址
            target: "http://192.168.0.111:8080",
            changeOrigin: true, // 允许跨域
            pathRewrite: {
              "^/api": "/"
            },
            headers: {referer: ''}
          }
        }
      }
    )

startRenderer整个方法完整代码如下：

function startRenderer () {
  return new Promise((resolve, reject) => {
    rendererConfig.entry.renderer = [path.join(__dirname, 'dev-client')].concat(rendererConfig.entry.renderer)
    rendererConfig.mode = 'development'
    const compiler = webpack(rendererConfig)
    hotMiddleware = webpackHotMiddleware(compiler, {
      log: false,
      heartbeat: 2500
    })

    compiler.hooks.compilation.tap('compilation', compilation => {
      compilation.hooks.htmlWebpackPluginAfterEmit.tapAsync('html-webpack-plugin-after-emit', (data, cb) => {
        hotMiddleware.publish({ action: 'reload' })
        cb()
      })
    })

    compiler.hooks.done.tap('done', stats => {
      logStats('Renderer', stats)
    })

    const server = new WebpackDevServer(
      compiler,
      {
        contentBase: path.join(__dirname, '../'),
        quiet: true,
        hot: true,
        before (app, ctx) {
          // app.use(hotMiddleware)
          ctx.middleware.waitUntilValid(() => {
            resolve()
          })
        },
        proxy:{
          "/api": {
            //测试服务接口地址
            target: "http://192.xxx.x.xxx:8080",
            changeOrigin: true, // 允许跨域
            pathRewrite: {
              "^/api": "/"
            },
            headers: {referer: ''}
          }
        }
      }
    )

    server.listen(9080)
  })
}