Невозможно передать байтовые данные из angular с помощью Uint8Array

У меня есть моя модель следующим образом

public class TimeSheetManagerModel
{
    public string EmailId { get; set; } = string.Empty;
    public string EmployeeName { get; set; } = string.Empty;
    public int Month { get; set; }
    public int Year { get; set; }
    public byte[] FileData { get; set; }
}

Я создал следующее в машинописном тексте

export class managerModel {
    employeeName: string;
    emailId: string;
    month: number;
    year: number;
    fileData: Uint8Array;

    constructor() {
        this.employeeName = "";
        this.emailId = "";
        this.month = 0;
        this.year = 0;
        this.fileData = new Uint8Array()
    }
}

Это мой код

const payload = new managerModel();
this.handleExport().then((arrayBuffer) => {
if (arrayBuffer)
payload.fileData = new Uint8Array(arrayBuffer);
payload.employeeName = this.updateModel.employeeName;
payload.emailId = this.updateModel.employeeEmailId;
payload.month = this.selectedDate.getMonth();
payload.year = this.selectedDate.getFullYear();

console.info('Payload before sending:', JSON.stringify(payload));
this.timeSheetService.nofityManager(payload)

Я вижу это в своей консоли, но в своем коде С# я вижу это как NULL, поэтому не уверен, что происходит не так.

Это мой код

nofityManager(managerModel: managerModel): Observable<any> {
        return this.configService.getBaseUrl().pipe(
            switchMap((baseUrl: string) => {
                const url = `${baseUrl}/NotifyManager`;
                const headers = new HttpHeaders({ 'Content-Type': 'application/json' });
                return this.http.post<any>(url, managerModel, { headers });
            })
        );
    }

Это мой вызов на стороне сервера

public async Task<bool> NotifyManager(TimeSheetManagerModel timeSheetManagerModel) { }

используйте formData вместо json для отправки файлов

Andrei 21.07.2024 09:55
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
1
53
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Опубликуйте данные с помощью файла через FormData вместо тела запроса JSON.

let formData = new FormData();

formData.append('fileData', new Blob([arrayBuffer]));
formData.append('employeeName', managerModel.employeeName);
formData.append('emailId', managerModel.emailId);
formData.append('month', managerModel.month);
formData.append('year', managerModel.year);

return this.http.post<any>(url, formData);

Поскольку вы отправляете данные как данные формы, ваше действие API должно ожидать получения данных в форме с атрибутом [FromForm].

public async Task<bool> NotifyManager([FromForm] TimeSheetManagerModel timeSheetManagerModel)

Кроме того, для свойства IFormFile используйте тип byte[] вместо FileData.

public class TimeSheetManagerModel
{
    ...

    public byte[] FileData { get; set; }
}

Тоже не повезло.

Developer 21.07.2024 10:43

Привет, извините за поздний ответ, вам нужно добавить атрибут [FromForm] в действие API. Обновил свой ответ.

Yong Shun 21.07.2024 13:48

Я вижу, что данные передаются, но не массив.

Developer 21.07.2024 15:07

Я попытался перейти на эту общедоступную асинхронную задачу Task<IActionResult> NotifyManager([FromForm] Services.Models.TimeSheetManagerModel timeSheetManagerModel, IFormFile fileData) и клиентскую formData.append('fileData', new Blob([managerModel.fileData], { type: ' application/octet-stream' }), 'fileData');

Developer 21.07.2024 16:24

Да, используйте FormFile вместо byte[] при отправке файла.

Yong Shun 22.07.2024 02:01

Это обходной путь, но я бы предложил ввести свойство Uint8Array TypeScript managerModel в виде строки, а затем использовать следующий код для преобразования двоичного массива в строку для удобства использования C#:

const stringOfFileData: string = new TextDecoder().decode(fileData);

Предполагая, что вы используете его как двоичный, вам нужно будет преобразовать его на другом конце, используя что-то вроде этого:

byte[] fileDataBytes = new UTF8Encoding().GetBytes(fileData);

Другие вопросы по теме