POST リクエストには、次を使用する必要があることに気付きました。
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
またはエラーが発生します。
ただし、FormData オブジェクトを唯一のデータとして送信すると、requestHeaders が設定されておらず、正常に動作します。
ヘッダーが必要なものとそうでないものがあるのは奇妙だと思いました。確認したかっただけです。
MDN ドキュメントには、次のように記載されています。
// xhr.setRequestHeader("Content-type", "multipart/form-data");
暗黙的に使用されます。IE は、デフォルトでフォーム データに使用されるため、実際にはこのヘッダーを設定しません。
設定すると、実際にはエラーが発生します。ドキュメントに従って設定すると、コードが壊れます。
ドキュメントから：
エンコーディング タイプが「multipart/form-data」に設定されている場合にフォームが使用するのと同じ形式を使用します。
この FormData の使用方法、つまり ajax で正しく使用する方法を説明する正式なドキュメントはありますか。
試行錯誤を繰り返しながら動作するようになりましたが、確かなリファレンスが欲しかったので、自分のコードに自信が持てるようになりました。