Asp.Net Core 3.1 發布請求不適用於服務器上的 Angular 8

Question

它適用於本地或 Postman 請求。 但是當我發布文件時，它會出現“未知錯誤”。 我正在使用 Windows 身份驗證。 我已經從 Firefox 嘗試過，然后出現以下錯誤： firefox error 。 當我接受 Firefox 原始請求並粘貼到 Postman 然后它起作用了。

這是我的 Controller 方法：

    [HttpPost]
    public ApiResult<OverTimePlanning> Post([FromBody]OverTimePlanning overTimePlanning)
    {
        logger.LogInformation("Planning Add started");
        var result = new OverTimePlanning();
        var apiResult = new ApiResult<OverTimePlanning>();
        ... Some codes are here ...
        logger.LogInformation("Planning Add ended");
        return apiResult;
    }

這是我的 C# model class：

public class OverTimePlanning
{
    public int ID { get; set; }
    public Guid GUID { get; set; }
    public string Unit { get; set; }
    public DateTime DateStarted { get; set; }
    public DateTime DateEnded { get; set; }
    public int? ApproverUserId { get; set; }
    public string ApproverUser { get; set; }
    public string ApproverUserPhoto { get; set; }
    public string Description { get; set; }
    public string ShortDescription { get; set; }
    public OnayDurumu Status { get; set; }
    public DateTime DateCreated { get; set; }
    public DateTime? DateUpdated { get; set; }
    public int UserCreatedId { get; set; }
    public string UserCreated { get; set; }
    public string UserPhoto { get; set; }
    public string ApproverComment { get; set; }
    /// <summary>
    /// Employee list
    /// </summary>
    public IEnumerable<OrganisationUser> Employees { get; set; } 
}

public class OrganisationUser
{
    public int ID { get; set; }
    public int EmployeeID { get; set; }
    public string Name  { get; set; }
    public string ShortName { get; set; }
    public string UserName { get; set; }
    public string Email  { get; set; }
    public string Photo    { get; set; }
    public string Manager { get; set; }
    public string Unit { get; set; }
    public int Level { get; set; }
   
}

這是我的 Angular 服務代碼：

saveOverTimePlanning(overtime: OverTimePlanning) {
const header = new HttpHeaders().set('Content-Type', 'application/json');
const options = { headers: header, withCredentials: true };
return this.http.post(this.apiUrl, JSON.stringify(overtime).replace(/_/g, ''), options);
}

這是我的 Angular model：

import { OrganisationUser } from './organisationUser.model'
export class OverTimePlanning {
private _id: number
public get id(): number {
    return this._id
}
public set id(value: number) {
    this._id = value
}
private _guid: string
public get guid(): string {
    return this._guid
}
public set guid(value: string) {
    this._guid = value
}
private _unit: string
public get unit(): string {
    return this._unit
}
public set unit(value: string) {
    this._unit = value
}
private _dateStarted: Date
public get dateStarted(): Date {
    return this._dateStarted
}
public set dateStarted(value: Date) {
    this._dateStarted = value
}
private _dateEnded: Date
public get dateEnded(): Date {
    return this._dateEnded
}
public set dateEnded(value: Date) {
    this._dateEnded = value
}
private _approverUserId: number
public get approverUserId(): number {
    return this._approverUserId
}
public set approverUserId(value: number) {
    this._approverUserId = value
}
private _approverUser: string
public get approverUser(): string {
    return this._approverUser
}
public set approverUser(value: string) {
    this._approverUser = value
}
private _approverUserPhoto: string
public get approverUserPhoto(): string {
    return this._approverUserPhoto
}
public set approverUserPhoto(value: string) {
    this._approverUserPhoto = value
}
private _description: string
public get description(): string {
    return this._description
}
public set description(value: string) {
    this._description = value
}
private _shortDescription: string
public get shortDescription(): string {
    return this._shortDescription
}
public set shortDescription(value: string) {
    this._shortDescription = value
}
private _status: number
public get status(): number {
    return this._status
}
public set status(value: number) {
    this._status = value
}
private _dateCreated: Date
public get dateCreated(): Date {
    return this._dateCreated
}
public set dateCreated(value: Date) {
    this._dateCreated = value
}
private _dateUpdated: Date
public get dateUpdated(): Date {
    return this._dateUpdated
}
public set dateUpdated(value: Date) {
    this._dateUpdated = value
}
private _userCreatedId: number
public get userCreatedId(): number {
    return this._userCreatedId
}
public set userCreatedId(value: number) {
    this._userCreatedId = value
}
private _userCreated: string
public get userCreated(): string {
    return this._userCreated
}
public set userCreated(value: string) {
    this._userCreated = value
}
private _userPhoto: string
public get userPhoto(): string {
    return this._userPhoto
}
public set userPhoto(value: string) {
    this._userPhoto = value
}
private _approverComment: string
public get approverComment(): string {
    return this._approverComment
}
public set approverComment(value: string) {
    this._approverComment = value
}

private _employees: OrganisationUser[]
public get employees(): OrganisationUser[] {
    return this._employees
}
public set employees(value: OrganisationUser[]) {
    this._employees = value
}

}

export class OrganisationUser {
private _id: number;
public get id(): number {
    return this._id;
}
public set id(value: number) {
    this._id = value;
}
private _employeeID: number;
public get employeeID(): number {
    return this._employeeID;
}
public set employeeID(value: number) {
    this._employeeID = value;
}
private _name: string;
public get name(): string {
    return this._name;
}
public set name(value: string) {
    this._name = value;
}
private _shortName: string;
public get shortName(): string {
    return this._shortName;
}
public set shortName(value: string) {
    this._shortName = value;
}
private _userName: string;
public get userName(): string {
    return this._userName;
}
public set userName(value: string) {
    this._userName = value;
}
private _email: string;
public get email(): string {
    return this._email;
}
public set email(value: string) {
    this._email = value;
}
private _photo: string;
public get photo(): string {
    return this._photo;
}
public set photo(value: string) {
    this._photo = value;
}
private _manager: string;
public get manager(): string {
    return this._manager;
}
public set manager(value: string) {
    this._manager = value;
}
private _unit: string;
public get unit(): string {
    return this._unit;
}
public set unit(value: string) {
    this._unit = value;
}
private _level_: number;
public get level_(): number {
    return this._level_;
}
public set level_(value: number) {
    this._level_ = value;
}
}

Answer 1

狀態碼為零通常是導致 CORS 錯誤的原因。 檢查 CORS 的服務器端實現。

這是 .net 中 CORS 中間件的官方文檔： https://docs.microsoft.com/en-us/aspnet/core.1security/cors?

在啟動時只包括中間件：（來自文檔）：

 readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options =>
    {
        options.AddPolicy(name: MyAllowSpecificOrigins,
                          builder =>
                          {
                              builder.WithOrigins("http://example.com",
                                                  "http://www.contoso.com");
                          });
    });
}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{       
    app.UseCors(MyAllowSpecificOrigins);
   
}

Answer 2

我了解到這一點：您不能使用 Windows 憑據發送原始/json 請求數據。 因為最新的瀏覽器不允許使用 Windows 憑據的預檢 (HttpOptions) 請求。