使用[MEAN]对API进行POST请求时，跨域请求被阻止

Question

我正在使用ngx-tags-input格式的表格，该表格允许我添加tags。我很惊讶，因为我已经在使用cors。见。

package.json

"dependencies": {
    "cors": "^2.8.5"
    ...
  }

server.js

const cors = require('cors');
...
app.use(cors());

这是我的简单表格 ask.component.html

<div class="container">
  <div class="row pt-5">
    <div class="col-md-12 col-lg-12 col-sm-12 bg-light">
      <form [formGroup]="editorForm (keydown.enter)="$event.preventDefault()">
        <div class="form-group">
          <!-- some other input field -->
        </div>
        <div class="form-group">
          <ngx-tags-input class="form-control input-lg" [ngModelOptions]="{standalone: true}" [(ngModel)]="makeNewQuest.tags" id="my-tags" name="tags"></ngx-tags-input>
        </div>
        <button class="btn btn-primary mt-3 mb-3" (click)="onSubmit()">Submit</button>
      </form>
     </div>
    </div>
</div>

我正在使用(keydown.enter)="$event.preventDefault()"来防止在回车键上提交表单，因为标签由回车键分隔。相反，我的表单是通过按钮上的click事件提交的。

这是我用于同一组件的ts文件

onSubmit() {
    console.log("clicked onSubmit");        
    var titleFromField = "Demo title";
    var content = "Demo content";
    var askedby = localStorage.getItem('firstname') + " " + localStorage.getItem('lastname');
    var date = new Date().toUTCString();

    this.makeNewQuest.qtitle = titleFromField;
    this.makeNewQuest.qcontent = content;
    this.makeNewQuest.date = date;
    this.makeNewQuest.askedby = askedby;

    console.log(this.makeNewQuest);


    this._auth.pushNewQuest(this.makeNewQuest)
      .subscribe(
        res => {
          //console.log(res);
          this._router.navigate(['/discussions']);
        },
        err => console.log(err)
      );
  }

一切看起来不错，但是数据没有推送到mongodb。我收到cors错误。

PS：我已经在github上上传了一些重要文件

Answer 1

发生此错误是因为您的应用程序不在与您的服务所在的域中运行。您需要通过添加“ Access-Control-Allow-Origin”标头将服务器配置为接受这些呼叫。