nextjs - 💡(How to fix) Fix Next.js 16: file uploads via Server Actions lose file on first call when using proxy.ts (dev only; mp3/mp4) [7 comments, 6 participants]

TL;DR

The issue can likely be resolved by adjusting the proxy.ts configuration to properly handle mp3/mp4 file uploads in development mode.

Guidance

• Review the proxy.ts file to ensure it is correctly configured for handling multipart/form-data requests, which are typically used for file uploads.
• Verify that the proxy.ts configuration is not interfering with the upload process by checking for any logging or debugging statements that may indicate where the issue lies.
• Test the upload process with different file types to confirm that the issue is specific to mp3/mp4 files and not a general problem with file uploads.
• Consider adding logging statements to the server action code to track the file upload process and identify where the file is being lost.

Example

No specific code example can be provided without more information about the proxy.ts configuration and server action code. However, ensuring that the proxy.ts file is set up to handle multipart/form-data requests correctly is crucial. For example, using a library like http-proxy-middleware might require specific configuration for handling such requests.

Notes

The issue seems to be related to the interaction between the proxy.ts configuration and the server action code in development mode. The fact that removing proxy.ts resolves the issue suggests that the problem lies in how the proxy is handling file uploads.

Recommendation

Apply a workaround by adjusting the proxy.ts configuration to correctly handle mp3/mp4 file uploads, as the root cause appears to be related to this configuration.