400 (Bad Request) - Change the content type to application/graphql in angular2

Question

I have tried many times to change the content type to application/json or application/graphql. Due to this text/plain content type I cannot fetch the graphql result. Please give me a solution. I have given my codes and console results.

app.module.ts

// Create the client as outlined above

const client = new ApolloClient({

  networkInterface: createNetworkInterface({
    uri: 'http://192.168.1.177:8080/graphql',
    opts: {
      method: 'POST',
    mode: 'no-cors',


  }
  }),
});
export {
  client
}
export function provideClient(): ApolloClient {
  return client;
}

testgraphql.component.ts

export class TestgraphqlComponent implements OnInit {
   loading: boolean;
    author: any;
    authors: ApolloQueryObservable<any>;
  constructor(private apollo: Apollo) { }

  ngOnInit() {
    this.authors = this.apollo.watchQuery({
      query: gql`{
    user(id: 5) {
      firstName
      lastName
    }
  }`,
    });





  }

}

Console error

POST http://192.168.1.177:8080/graphql 400 (Bad Request)

Request Headers

POST /graphql HTTP/1.1
Host: 192.168.1.177:8080
Connection: keep-alive
Content-Length: 77
accept: */*
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36
content-type: text/plain;charset=UTF-8
Referer: http://localhost:4200/
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.8

Answer 1

I have solved the issue. It was server side issue. Server side should contain CORS configuration.