尝试更新/删除Firebase JSON数据库中的值时发生CORS错误

问题描述

我有一个Ionic应用程序，该应用程序应请求用户，添加用户，更新和从Firebase数据库中删除。为此，我一直在关注Andreas Dormann的Ionic 5书（因此使用HttpClient）和本教程https://angular.io/guide/http。基本上，我有一个页面可以吸引这样的用户：

users: Any;

constructor(public usersService: UsersService) { }
.
.
.
getUsers() {
  this.usersService.getUsers().then(data => this.users = Object.keys(data).map(i => data[i]));
}

然后，用户服务获取用户：

public getUsers(): Promise<object> {
  return this.http.get<User[]>(`${this.baseUrl}/Users.json`).toPromise();
}

我以类似的方式添加用户：

public addUser(newUser: User) {
    return this.http.post<User>(`${this.baseUrl}/Users.json`,newUser).toPromise();
}

所以现在我要像这样更新和删除用户：

public updateUser(id,user) {
  return this.http.put<User>(`${this.baseUrl}/Users.json/${id}`,newUser,this.httpOptions).pipe();
}

httpOptions是一个对象：

httpOptions = {
    headers: new HttpHeaders({
      'Access-Control-Allow-Origin': '*','Access-Control-Allow-Headers': 'Access-Control-Allow-Origin,*','Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE,OPTIONS','Accept': 'application/json','Content-Type': 'application/json'
    })
  };

然后在另一个页面中调用更新用户，如下所示：

this.usersService.updateUser(userId,changedUser).subscribe();

然后，如果要删除，则具有以下类似功能：

public deleteUser(id) {
  return this.http.delete<User>(`${this.baseUrl}/Users.json/${id}`,this.httpOptions).toPromise();
}

处理方式如下：

this.usersService.deleteUser(user.id).then(
  data => showSuccess(data),error => showError(data)
);

showSuccess和showError仅在屏幕或控制台上显示消息。到目前为止，getUsers和addUser工作正常。但是，如果我尝试更新和/或删除用户，则会得到以下信息：

Access to XMLHttpRequest at 'https://MY_DB_URL.firebaseio.com//Users.json/THE_USER_ID' 
from origin 'http://localhost:8100' has been blocked by CORS policy: Response to
 preflight request doesn't pass access control check: It does not have HTTP ok status.

那么，为什么这些请求仅在不使用参数的情况下才能起作用？我想我正确使用了ID，但是如果我输错了，请告诉我。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular-httpclient ionic5