Why parameter query is null in GraphQL Controller when I pass graphql query from Angular?

Question

I'm trying to use GraphQL, I built everything correctly, but when I call graph controller from Angular application parameter 'query' in method is null, but when I call from Postman, everything works well.

In addition I use Apollo to connect GraphQl.

see my GraphQl Controller:

[Route("graphql")]  
    public class GraphQLController : Controller
    {
        [HttpPost]
        public async Task<IActionResult> Post([FromBody] GraphQLQuery query)
        {
            try
            {
                var schema = new Schema { Query = new StarWarsQuery() };

                var result = await new DocumentExecuter().ExecuteAsync(_ =>
                {
                    _.Schema = schema;
                    _.Query = query.Query;

                }).ConfigureAwait(false);

                if (result.Errors?.Count > 0)
                {
                    return BadRequest();
                }

                return Ok(result);
            }
            catch (Exception ex)
            {
                throw new Exception();
            }
        }
    }

Here is my angular code:

import { Component, OnInit, Query } from '@angular/core';
import { Apollo } from 'apollo-angular';
import { Observable } from 'rxjs/Observable';
import { map } from 'rxjs/operators';

import gql from 'graphql-tag';
import { Course, CourseList } from './types';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit {
  constructor(
    private apollo: Apollo
  ) { }

  courses: Observable<Course[]>;

  ngOnInit() {

    this.apollo.query({query: gql`query { allCourses {id title author descriptin topic url }}`}).subscribe(console.log);
  }

}

Postman request:

{
"query": "query { allCourses {id title author descriptin topic url }}"
}

Request From Postman everythings is working:

but when I try to send from angular, query is null:

did you find a solution to this? i'm having the exact same issue — philr, Aug 16 '18 at 15:18
As I remember I removed 'apollo graphql' from my project and I made simple http request and add query in paramater. If you have any problem I'll post real working simple here — Avtandil Kavrelishvili, Aug 17 '18 at 18:35

philr · Accepted Answer · 2018-08-24T19:14:28.347

3

Just in case anyone else has this problem, i found the solution! If you navigate into the definition of the GraphQLQuery class, change public string Variables { get; set; } from string to object so it becomes:

public object Variables { get; set; }

and the query will no longer be null

edited Aug 24 '18 at 19:14

answered Aug 24 '18 at 18:54

philr

1,860
1
21
31

Why parameter query is null in GraphQL Controller when I pass graphql query from Angular?

1 Answers1