I am getting Error 415 while uploading image in Angular and .Net core project

Question

I want to upload an image to my project, but unfortunately it gives an error of 415. Swagger does not give an error when I install it from above, but it gives an error when I install it from above Angular. What is the solution to this?

Backend Web Api Code;

 [Produces("application/json", "text/plain")]
        [ProducesResponseType(StatusCodes.Status200OK, Type = typeof(string))]
        [ProducesResponseType(StatusCodes.Status400BadRequest, Type = typeof(string))]
        [HttpPost("update")]
        public async Task<IActionResult> Update([FromFrom] UpdatePresidentMessageCommand updatePresidentMessage)
        {
            var result = await Mediator.Send(updatePresidentMessage);
            if (result.Success)
            {
                return Ok(result.Message);
            }
            return BadRequest(result.Message);
        }
    }

Backend Handlers Code;

if (request.Image != null)
                {
                    var fileUpload = Core.Extensions.FileExtension.FileUpload(request.Image, fileType: Core.Enums.FileType.Image);
                    if (fileUpload != null)
                    {
                        isTherePresidentMessageRecord.Image = fileUpload.Path;
                    }
                }

Angular Service Code;

updatePresidentMessage(presidentMessage: FormData): Observable<any> {
    return this.httpClient.post('https://localhost:60021/Admin/api' + '/presidentMessages/update', presidentMessage,{ responseType: 'text' });

  }

Angular Ts Code;

 update(): void {
    let presidentModel = Object.assign({}, this.presidentMessageFormGroup.value);
    const formData = new FormData();
    formData.append('id', presidentModel.id.toString());
    formData.append('shortDescription', presidentModel.shortDescription);
    formData.append('description', presidentModel.description);
    for (const photo of this.photos) {
      formData.append('image', photo, photo.name);
    }

    this.presidentMessageService.updatePresidentMessage(formData).subscribe(response => {
      this.alertifyService.success(response);
    });
  }

   
onFileSelect(event: any) {
if (event.target.files.length > 0) {
for (const file of event.target.files) {
  this.photos.push(file);
  }
 }
}

" const headers = new HttpHeaders().set('Content-Type', 'multipart/form-data'); " the error I get when I add;

enter image description here

UpdatePresidentMessageCommand Class; 


        public int ID { get; set; }
        public string ShortDescription { get; set; }
        public string Description { get; set; }
        public IFormFile Image { get; set; }

        public class UpdatePresidentMessageCommandHandler : IRequestHandler<UpdatePresidentMessageCommand, IResult>
        {
            private readonly IPresidentMessageRepository presidentMessageRepository;
            private readonly IUserService userService;

            public UpdatePresidentMessageCommandHandler(IUserService userService, IPresidentMessageRepository presidentMessageRepository)
            {
                this.userService = userService;
                this.presidentMessageRepository = presidentMessageRepository;
            }

            [LogAspect(typeof(FileLogger))]
            [SecuredOperation(Priority = 1)]
            public async Task<IResult> Handle(UpdatePresidentMessageCommand request, CancellationToken cancellationToken)
            {
                var isTherePresidentMessageRecord = await this.presidentMessageRepository.GetAsync(u => u.ID == request.ID);
                if (isTherePresidentMessageRecord == null)
                {
                    return new ErrorResult(message: Messages.Error);
                }

                isTherePresidentMessageRecord.ShortDescription = request.ShortDescription;
                isTherePresidentMessageRecord.Description = request.Description;
                isTherePresidentMessageRecord.UpdateByUserID = this.userService.GetNameIdentifier();
                isTherePresidentMessageRecord.UpdateDateTime = System.DateTime.Now;

                if (request.Image != null)
                {
                    var fileUpload = Core.Extensions.FileExtension.FileUpload(request.Image, fileType: Core.Enums.FileType.Image);
                    if (fileUpload != null)
                    {
                        isTherePresidentMessageRecord.Image = fileUpload.Path;
                    }
                }
                

                this.presidentMessageRepository.Update(isTherePresidentMessageRecord);
                await this.presidentMessageRepository.SaveChangesAsync();
                return new SuccessResult(Messages.Updated);
            }
        }

Answer 1

尝试在 POST 请求的标头上设置正确的“Content-Type”。