The problem of Interface Cross-domain Agent failure in nuxt

introduce @ gauseen/nuxt-proxy module into nuxt.js to solve interface cross-domain restrictions, but page access error

clipboard.png

nuxt.config.js

module.exports = {
    ...
    
    modules: [
        // 
        "@gauseen/nuxt-proxy",
    ],
    proxyTable: [
        "/api",
        {
            target: "http://192.168.1.181:3004", // api
            ws: true,
            pathRewrite: { "^/api": "/" }
        }
    ]
     
    ...
}

axios

axios.post("/login", data)

but just comment out the proxyTable, page reply visit, what is the cause? Is there a solution

Apr.09,2021

if you find out the vue project generated by vue-cli scaffolding, you will find this code in the build/dev-server.js file

// proxy api requests
Object.keys(proxyTable).forEach(function (context) {
  var options = proxyTable[context]
  if (typeof options === 'string') {
    options = { target: options }
  }
  app.use(proxyMiddleware(options.filter || context, options))
})

Yes, the proxyTable you're talking about is an express middleware, but this express middleware is different from nuxt's middleware. It seems that the authorities have not explained exactly how to add it. Nuxt seems to use express when it is developed locally.

< hr >

after some efforts, I finally got you out of this thing. How to add express middleware in nuxt?

first, install dependencies
  https://github.com/nuxt-commu.

Menu