Angular7 - .NET Core v2 抛出 http 415（不支持的媒体类型）

Question

I am trying to send the user's filled form as json to my api. But because it is not Json (I think) it returns this error in the console of my browser:

415 (Unsupported Media Type)

I have enabled CORS in my backend and also I am receiving json [FromBody] and I am pretty sure that the problem is from the angular code.

This is my form:

<form [formGroup]="messageForm" (ngSubmit)="onSubmit(messageForm)" class="form-inline mt-2 mt-md-0">
      <h5 *ngIf="success"></h5>
        <input type="text" formControlName="Words" class="form-control mr-sm-2"  placeholder="test" aria-label="Words">
        <div *ngIf="submitted && messageForm.controls.Words.errors" class="error">
          <div *ngIf="messageForm.controls.Words.errors.required">test</div>
        </div>
      <button type="submit" value="Send message" class="btn btn-outline-success my-2 my-sm-0">test</button>
    </form>

This is my service class:

import { Component, OnInit } from '@angular/core';
import { DataService } from '../data.service';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  messageForm: FormGroup;
  submitted = false;
  success = false;
  logsList;

  constructor(private data: DataService , private formBuilder: FormBuilder ) { }

  ngOnInit()  {
    this.messageForm = this.formBuilder.group({
      Words: ['', Validators.required]
    });
    }
    onSubmit(messageForm) {
      this.submitted = true;
      this.data.search(this.messageForm.value)
      .subscribe(dat=> {console.log(dat)})

      if (this.messageForm.invalid) {
        return;
      }

      this.success = true;

    }

and this is my data service:

import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse, HttpHeaders } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class DataService {
  logsList;
  baseUrl = 'http://localhost:5000/Logs'

  constructor(private http: HttpClient) { }
  search(words: String) {

    var body = JSON.stringify(words);
    const headers = new HttpHeaders();
    headers.set('Content-Type', 'application/json; charset=utf-8');
    console.log(body)
    console.log(headers)
    return this.http.post(this.baseUrl + '/Search', body , {headers: headers})
  }
}

Answer 1

A simple string is already valid JSON. Since you are using a String object, you can simple set the body as the actual string value :

let body = words.toString(); // or simply : let body = words; it should work as well IMHO

As a side note, I'd recommend using simply string as the type for words , instead of String .

This latter is supposed to be fancy wrapper around string (in C# however, string is an alias for String and so they are equivalent, though it's still recommended to use the alias lower-case version as well).

What happened ?

Without seeing actual data it can be only speculation. I can't tell if it is the root of the problem, but doing a JSON.stringify on a string will end you sending double-double quoted string as the body of of your HTTP POST, which is maybe why your C# backend is not happy with it.