Proxy Axios auth对象在Nuxt产品中不工作

我正在使用@nuxtjs/axios和@nuxtjs/proxy与Nuxt构建一个项目

我有一个表单可以发布到外部（第三方）API（Wufoo.com）

它在localhost:3000上运行良好，但在生产服务器（）上测试项目时，

auth:{}

对象似乎没有与post请求一起发送

当我在真正的服务器上提交表单时，Chrome会显示用户名和密码弹出窗口，Firefox会立即给我401

numxt.config.js

/*
** Nuxt.js modules
*/
modules: [
'@nuxtjs/axios',
'@nuxtjs/proxy'
],

/*
** Axios module configuration
*/
axios: {
proxy: true,
},

/*
** Proxy module configuration
*/

proxy: {
'/wufoo': {
    target: 'https://my-account-name.wufoo.com/api/',
    pathRewrite: {
    '^/wufoo': '/'
    }
}
},

我的提交表单方法

async onSubmit() {
    const auth = {
    username: 'xxxxxxxxxxx',
    password: 'yyyyyyyyyyy'
    }
    const postUrl = '/wufoo/v3/forms/f8dxcv50lg1kph/entries.json'

    const headers = {
    'Content-Type': 'multipart/form-data'
    }

    const formData = new FormData()

    formData.append('Field1', this.name) // name
    formData.append('Field5', this.email) // email
    formData.append('Field3', this.phone) // phone

    await this.$axios
    .$post(postUrl, formData, {
        headers,
        auth: {
        username: 'xxxxxxxx',
        password: 'yyyyyyyy'
        }
    })
    .then(response => {
        console.log(response)
    })
    .catch(error => {
        console.log(error)
    })
}

---

我最终采取了一种不同的方法，效果很好。它也可以说更好/更安全

我使用Nuxt选项运行服务器端函数（Node/Express），将数据发布到

我设置了

@/serverMiddleware/postcontactform.js

var bodyParser = require('body-parser')
var express = require('express')
var app = express()
var request = require("request");

app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())


app.all('/', (req, res) => {
    if (req.method === 'POST') {
        var data = req.body; // req.query not allowed
    }

    request({
        uri: "https://my-account-name.wufoo.com/api/v3/forms/f8dssdsdv00lg5kph/entries.json",
        method: "POST",
        auth: {
            'username': 'xxxxxxx',
            'password': 'yyyyyyy',
            'sendImmediately': false
        },
        form: {
            'Field5': data.name,
            'Field1': data.email,
            'Field2': data.phone,
        }
    }, function (error, response, body) {
        res.send({
            body,
            response,
            error
        })
    });
})

module.exports = {
    path: '/api/postcontactform',
    handler: app
}

这个新的服务器端代码我可以像这样在前端调用

async onSubmit() {
    const postUrl = '/api/postcontactform'

    const formFields = {
        name: this.name,
        email: this.email,
        phone: this.phone,
    }

    await this.$axios
    .$post(postUrl, formFields)
    .then(response => {
        console.log(response)
    })
    .catch(error => {
        console.log(error)
    })
}

---

我最终采取了一种不同的方法，效果很好。它也可以说更好/更安全

我使用Nuxt选项运行服务器端函数（Node/Express），将数据发布到

我设置了

@/serverMiddleware/postcontactform.js

var bodyParser = require('body-parser')
var express = require('express')
var app = express()
var request = require("request");

app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())


app.all('/', (req, res) => {
    if (req.method === 'POST') {
        var data = req.body; // req.query not allowed
    }

    request({
        uri: "https://my-account-name.wufoo.com/api/v3/forms/f8dssdsdv00lg5kph/entries.json",
        method: "POST",
        auth: {
            'username': 'xxxxxxx',
            'password': 'yyyyyyy',
            'sendImmediately': false
        },
        form: {
            'Field5': data.name,
            'Field1': data.email,
            'Field2': data.phone,
        }
    }, function (error, response, body) {
        res.send({
            body,
            response,
            error
        })
    });
})

module.exports = {
    path: '/api/postcontactform',
    handler: app
}

这个新的服务器端代码我可以像这样在前端调用

async onSubmit() {
    const postUrl = '/api/postcontactform'

    const formFields = {
        name: this.name,
        email: this.email,
        phone: this.phone,
    }

    await this.$axios
    .$post(postUrl, formFields)
    .then(response => {
        console.log(response)
    })
    .catch(error => {
        console.log(error)
    })
}