Bug: Can't send ArrayBuffer to Server Action despite react.dev saying so

[alfonsusac]

Can't send ArrayBuffer to Server Action despite react.dev saying that you can. I'm not sure if this is an error or my part or the documentation. I retrieved the arrayBuffer from file of formData, then pass it through the parameter of the Server Action.

It seems like it doesn't get sent to the server because it can't be parsed due to ArrayBuffer being serializable but not iterable.

However this is somewhat confusing because you can attach File in FormData in the form of Blob and send it to the Server Action.

I understand that FormData is handled separately but I'm not sure I understand why it can't be done the same with ArrayBuffer.

I understand that I can just pass the FormData to send files but In my case I needed to transform the Files first before uploading and it ends up with a Blob.

React version:

Steps To Reproduce

1. Create form, input, submit button, and also onSubmit function using Client Action
2. Retrieve the arrayData from the formData then pass it to server action

Link to code example:

https://codesandbox.io/p/devbox/nextjs-arraybuffer-server-action-36gvxn

The current behavior

Throws client-side error

The expected behavior

ArrayBuffer gets sent to the server

The documentation:

Please let me know if I fail to understand the documentation or if it's something wrong in the documentation

[alvgaona]

I'm having the same issue.

[duh2]

I'm having the same issue.

Wokraround: I've tested multiple react/nextjs version combinations and now found working one. For me it's nextjs 13.5.6 and react 18.2.0. Reply pls when you try it out)

[alvgaona]

I will test. I'm using nextjs@14.0.4 and react@18.2

[alfonsusac]

I'm having the same issue.

Wokraround: I've tested multiple react/nextjs version combinations and now found working one. For me it's nextjs 13.5.6 and react 18.2.0. Reply pls when you try it out)

The workaround i have for now is to wrap the data with FormData first and append the file before sending it to the server action

[vetan2]

It seems that shipping FormData as parameters of the server action is enabled, but returning FormData from the server action is still not enabled.

[alfonsusac]

It seems that shipping FormData as parameters of the server action is enabled, but returning FormData from the server action is still not enabled.

as per the documentation, that is the intended behavior

[eps1lon]

They're supported as return values in Server Actions in React's Experimental release channel. Sending ArrayBuffer to Server Actions is currently not supported but we want to achieve parity eventually.

I'll file a PR updating the docs accordingly.

[sebmarkbage]

Will be supported by #28819

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[github-actions]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!