2

Im trying to connect my angular-Apollo Client to my graphql backend and I Keep getting a 405 error. My Server is hosted on localhost port 4000 and my Client is also on localhost (port 4200). For my client i used the Basic Setup as shown in the Apollo docs and made a few Adjustments to it. If I look at the request in the browser I can see that Apollo is using the Method Options. As far as I graphql Server doesnt support the Options method. So how can I get my client to use the get or post method or allow the Options method?

My client scrpit:

import {Component, OnInit} from '@angular/core';
import {Apollo} from 'apollo-angular';
import gql from 'graphql-tag';

@Component({
  selector: 'app-patient',
  template: `
    <div *ngIf="loading">
      Loading...
    </div>
    <div *ngIf="error">
      Error :(
    </div>
    <div *ngIf="allPatients">
      <div *ngFor="let patient of allPatients">
        <p>{{patient.id}}</p>
      </div>
    </div>
  `,
})
export class PatientComponent implements OnInit {
  allPatients: any[];
  loading = true;
  error: any;

  constructor(private apollo: Apollo) {}

  ngOnInit() {
    this.apollo
      .watchQuery<any>({
        query: gql`
          {
            allPatients {
              id
            }
          }
        `,
      })
      .valueChanges.subscribe(result => {
        this.allPatients = result.data && result.data.allPatients;
        this.loading = result.loading;
        this.error = result.errors;
      });
  }
}

And here is my server scrpit file:

var express = require('express');
var graphqlHTTP = require('express-graphql');
var { buildSchema } = require('graphql');

// Construct a schema, using GraphQL schema language
var schema = buildSchema(`
  type Patient {
    id: String
  }
  type Query {
    allPatients: [Patient]
  }
`);

// The root provides a resolver function for each API endpoint
var root = {
  allPatients: () => {
    return [{id: "testID1"}, {id: "testID2"}];
  },
};

var graphQLApp = express();
graphQLApp.use('/graphql', graphqlHTTP({
  schema: schema,
  rootValue: root,
  graphiql: true,
}));
graphQLApp.listen(4000);
console.log('Running a GraphQL API server at http://localhost:4000/graphql');

0 Answers0