NUXT3 服务器/api 参数导致生产时出现 500 错误

Question

我目前正在开发一个 NUXT3 项目，我有一个表单可以收集信息和文件并在发布到相关位置之前发送到服务器/api。

在本地，这按预期工作，但在生产中，它偶然发现查询参数已从表单发送到服务器/api，并导致 500 状态代码。

我在下面添加了我的 form.vue 和 server/api/form.ts 文件，如果有人能发现出了什么问题，请提出建议，因为我正在绕圈子。

提前谢谢您。

pages/form.vue

        let formData = new FormData();

        for( let i = 0; i < files.value.length; i ++ ){
            formData.append('files['+i+']', files.value[i] );
        }

        let requestOptions = {
            method: 'POST',
            body: formData
        }
        await fetch( '/api/form/submit' + '?' + new URLSearchParams(form), requestOptions).then((response) => {
            return response.json()
        }).then((data) => {
            console.log(data)
        }).catch((error) => {
            console.log(error)
        })

服务器/api/form.ts

import slugify from 'slugify';
import { Base64 } from 'js-base64';

export default defineEventHandler(async (event) => {

    const queryData = getQuery(event)
    const bodyData = await readMultipartFormData(event)

    const apikey = 'xxx'
    const username = 'xxx'
    const password = 'xxx'
    
    const to = queryData.to
    const from = queryData.from
    const subject = queryData.subject
    const message = queryData.message

    const notify = queryData.notify
    const confirmation = queryData.confirmation
    const firstname = queryData.firstname
    const surename = queryData.surename
    const telephonenumber = queryData.telephonenumber
    const service = queryData.service
    const projectdescription = queryData.projectdescription

    let files: any[] = []
    
    if(bodyData) {
        bodyData.forEach((item) => {
            if(item.filename) {
                files.push(item)
            }
        })
    }

    /* Step 1 - Login */
    const login = async () => {

        let requestOptions = {
            method: 'POST'
        }
        await fetch(`https://www.filemail.com/api/authentication/login?apikey=${apikey}&username=${username}&password=${password}`, requestOptions).then((response) => {
            return response.json()
        }).then((data: any) => {
            //console.log(`Logged In ✓`)
            initialize(data)
        }).catch((error) => {
            console.warn(error)
        })

    }

    /* Step 2 - Initalize */
    const initialize = async (data: any) => {

        let requestOptions = {
            method: 'POST'
        }
        await fetch(`https://www.filemail.com/api/transfer/initialize?apikey=${apikey}&logintoken=${data.logintoken}&to=${to}&from=${from}&subject=${subject}&message=${message}&notify=${notify}&confirmation=${confirmation}`, requestOptions).then((response) => {
            return response.json()
        }).then((data) => {
            //console.log(`Initialized ✓`)
            saveFile(data)
        }).catch((error) => {
            console.warn(error)
        })

    }

    /* Step 3 - Save Files */
    const saveFile = async (data: any) => {

        const transferUrl = data.transferurl
        const transferId = data.transferid
        const transferKey = data.transferkey

        for (let i = 0; i < files.length; i++) {

            let formData = new FormData()

            formData.append('files', new Blob([files[i].data], {type: files[i].type}))

            let requestOptions = {
                headers: {
                    'Content-Type': 'multipart/form-data',
                },
                method: 'POST',
                body: formData
            }
            await fetch(`${transferUrl}?transferid=${transferId}&transferkey=${transferKey}&runtime=html5&chunksize=5000000&thefilename=${ slugify(files[i].filename, { lower: true }) }&chunks=10&chunk=0&retry=0`, requestOptions).then((response) => {
                return response
            }).then(() => {
                //console.log(`${ slugify(files[i].filename, { lower: true }) } Uploaded ✓`)
            }).catch((error) => {
                console.warn(error)
            })

        }

        complete(data)

    }

    /* Step 4A - Complete */
    const complete = async (data: any) => {

        const transferId = data.transferid
        const transferKey = data.transferkey

        let formData = new FormData()
        formData.append('transferid', transferId)
        formData.append('transferkey', transferKey)
        formData.append('failed', 'false')

        let requestOptions = {
            method: 'POST',
            body: formData
        }
        await fetch('https://www.filemail.com/api/transfer/complete', requestOptions).then((response) => {
            return response.json()
        }).then((data) => {
            //console.log(`Completed ✓`)
            campaignMonitor(data)
        }).catch((error) => {
            console.warn(error)
        })

    }

    /* Step 4B - Campaign Monitor */
    const campaignMonitor = async (data: any) => {

        const username = 'xxx'
        const password = 'xxx'

        let requestOptions = {
            method: 'POST',
            headers: {
                'Authorization': 'Basic ' + Base64.encode(username + ':' + password),
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                'To': [
                    '[email protected]',
                    '[email protected]'
                ],
                'Data': {
                    'first_name': firstname,
                    'surename': surename,
                    'email_address': from,
                    'telephone_number': telephonenumber,
                    'service': service,
                    'project_description': projectdescription,
                    'downloadurl': data.downloadurl
                },
                'ConsentToTrack': 'Yes'
            })
        }
        await fetch('https://api.createsend.com/api/v3.2/transactional/smartemail/xxx/send', requestOptions).then((response) => {
            return response.json()
        }).then(() => {
            //console.log(`Sent ✓`)
        }).catch((error) => {
            console.warn(error)
        })

    }

    login()

    return ''

})

网络标头：

我尝试在请求中使用查询：{form}，我还尝试了新的 URLSearchParams(form) 来发送参数。

Answer 1

此问题可能是由于 SSL 证书连接不正确造成的 通过任何 SSL 检查器，您都会看到错误。 修复它，服务器请求将起作用