c# - Angular7 - .NET Core v2 抛出 http 415(不支持的媒体类型)

Question

我正在尝试将用户填写的表单作为 json 发送到我的 api。但因为它不是 Json(我认为)，所以它在浏览器的控制台中返回此错误:

415 (Unsupported Media Type)

我已经在后端启用了 CORS，并且我还收到了 json [FromBody] 并且我非常确定问题出在 Angular 代码上。

这是我的表格:

<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>

这是我的服务类别:

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;

    }

这是我的数据服务:

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

一个简单的字符串已经有效的JSON。由于您使用的是 String 对象，因此您可以简单地将正文设置为实际字符串值:

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

作为旁注，我建议仅使用 string 作为 words 的类型，而不是 String。

后者应该是 string 的精美包装(但是在 C# 中，string 是 String 的别名，因此它们是等效的，但仍然建议使用别名小写版本)。

发生了什么？

在没有看到实际数据的情况下，这只能是猜测。我无法判断这是否是问题的根源，但是对字符串执行 JSON.stringify 将会导致您发送双双引号字符串作为 HTTP POST 的正文，即也许为什么你的 C# 后端对此不满意。