0

I'm creating a Laravel backend for a Nuxt app, and am using Lighthouse-PHP to deliver data via GraphQL.

I'm trying to set up a query to do a find by slug instead of the default ID. When I run the query in the graphql playground, it correctly returns the data, however when I load the page on the frontend, it returns null.

Backend

schema.graphql

type Query {
  forumCategoryBySlug(slug: String! @eq): ForumCategory @find
}

type ForumCategory {
  id: ID!
  title: String!
  description: String!
  slug: String!
  subcategories: [ForumSubcategory!]! @hasMany
  created_at: DateTime!
  updated_at: DateTime!
}

ForumCategory.php model

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\HasMany;

class ForumCategory extends Model
{
    protected $fillable = [
        'title', 'description', 'slug'
    ];

    public function subcategories(): HasMany
    {
        return $this->hasMany(ForumSubcategory::class);
    }
}

Frontend

Index.vue

import categoryQuery from '~/apollo/queries/forum/category.gql';
export default {
  apollo: {
    category: {
      prefetch: false,
      fetchPolicy: 'network-only',
      query: categoryQuery,
      variables () {
        return {
          slug: this.$route.params.slug
        };
      }
    }
  },
}

category.gql

query Category($slug: String!) {
  category: forumCategoryBySlug(slug: $slug) {
    id
    title
    description
    slug
  }
}

I feel like I've triple-checked every little thing but can't for the life of me figure out why the data is still returning null. Any help would be greatly appreciated!

J. Jackson
  • 3,326
  • 8
  • 34
  • 74
  • compare network requests (with graphiql/playground), body (value for variable passed properly?), headers, ... auth/ACL reasons? – xadm Nov 05 '20 at 23:56
  • I was just doing that actually, and they appear to be identical. I'm messing around with creating a custom resolver (https://lighthouse-php.com/3.1/the-basics/fields.html#resolving-fields) right now – J. Jackson Nov 06 '20 at 00:00
  • try to recreate request in postman – xadm Nov 06 '20 at 00:16
  • It all looks good there. I'm not sure why it's working in the Playground and not in the app, but I have a feeling it has something to do with needing to create a custom Lighthouse resolver. – J. Jackson Nov 06 '20 at 00:19
  • not, for sure not a resolver level if it works in playground (still 'external', from FE call) ...middleware/auth/other reasons, check detaily headers/cors/auth – xadm Nov 06 '20 at 00:39
  • Hmm good point. I did "fix" a CORS issue earlier, so maybe that actually caused some other issues. I'll have to dig into it, thanks! – J. Jackson Nov 06 '20 at 00:41
  • hmm, probably not cors as it wouldn't return normal 200 response, it affects entire response, not fields/query parts – xadm Nov 06 '20 at 01:12
  • Also a good point. I’ve been staring at it so long nothing makes sense anymore haha. Somehow both Playground and my app are now returning null so I’m not getting anything back now. – J. Jackson Nov 06 '20 at 01:48

1 Answers1

2

Figured it out after a few days. Essentially I needed to create a custom resolver.

schema.graphql

type Query {
  forumCategoryBySlug(slug: String! @eq): ForumCategory
}

app/GraphQL/Queries/ForumCategoryBySlug.php

<?php

namespace App\GraphQL\Queries;
use App\Models\ForumCategory;

class ForumCategoryBySlug
{
    /**
     * @param  null  $_
     * @param  array<string, mixed>  $args
     */
    public function __invoke($_, array $args)
    {
        $category = \App\Models\ForumCategory::findBySlug($args["slug"])->first();
        return $category;
    }
}
J. Jackson
  • 3,326
  • 8
  • 34
  • 74