GraphQL + Apollo 错误：未捕获（承诺中）

Posted 2023-03-10

【中文标题】GraphQL + Apollo 错误：未捕获（承诺中）

【英文标题】：GraphQL + Apollo Error: Uncaught (in promise)

【发布时间】：2018-07-30 19:53:37

【问题描述】：

我正在尝试通过单击按钮将新数据提交到我的本地 graphQL API，但出现错误：错误错误：未捕获（承诺）：错误：网络错误：http://localhost:4000/graphql 的 Http 失败响应：400错误的请求。

这个想法是，当您按下按钮时，新数据会被提交

  <button type="submit" (click)="onSubmit()" [disabled]="!personForm.valid" id="buttonSubmit" mat-raised-button color="accent"class="floated">Send</button>

onSubmit 函数调用突变

  onSubmit() 
  
    let id = 5;
    let vorname = 'user';
    let name =  'name';
    let email =  '[e-mail]';
    let status =  'true';
    let activity =  'Office';

    this.apollo.mutate<CreateUserMutationResponse>(
      mutation: CREATE_USER_MUTATION,
      variables: 
        id: id,
        vorname: vorname,
        name: name,
        email: email,
        status: status,
        activity: activity
      
    ).subscribe((response) => 

    );

    console.log('submitted');

  

我的 types.ts 中的突变看起来像这样

export const CREATE_USER_MUTATION = gql`
  mutation CreateUserMutation($id: ID!, $vorname: String!, $name: String!, $email: String!, $status: String!, $activity: String) 
    createUser(id: $id,vorname: $vorname, name: $name, email: $email, status: $status, activity: $activity) 
      id
      vorname
      name
      email
      status
      activity
    
  
`;

export interface CreateUserMutationResponse 
  createUser: String;

【参考方案1】：

当我发现你的问题时，我实际上遇到了同样的问题。这方面的文档很难找到，但是this example 向我提供了如何解决这个问题的线索。在我用try catch statement 包围突变后，它对我有用。 像这样的东西我很确定也会为你解决它：

onSubmit() 

  [...]

  try 
    this.$apollo.mutate <CreateUserMutationResponse>(
      mutation: CREATE_USER_MUTATION,
      variables: 
        id: id,
        vorname: vorname,
        name: name,
        email: email,
        status: status,
        activity: activity
       
     ).subscribe((response) =>  );
    catch (e) 
      console.error(e);
   

  console.log('submitted');

This page 还帮助我首先设置了突变（看来你已经正确地做了）。