Directus: Prevent URI too large

directus-prevent-uri-too-large.md

Here we can see the alternative solutions to prevent request URI too long / large (414 code)

using-graphql.js

fetch("https://directus.pizza/graphql", {
  method: "POST",
  body: JSON.stringify({
    query: `query {
      articles(filter: { categories: { categories_id: { title: { _icontains: "category" } } } }) {
        id
        title
        sort
        categories {
          categories_id {
            title
          }
        }
      }
    }`,
    variables: {},
  }),
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer mytoken",
  },
});

using-sdk.js

import { createDirectus, graphql } from '@directus/sdk';

interface Category {
  title: string;
}

interface ArticlesCategories {
  categories_id: Category;
}

interface Article {
	id: number;
	title: string;
  sort: number;
	categories: ArticlesCategories[];
}

interface Schema {
	articles: Article[];
}

const client = createDirectus<Schema>('https://directus.pizza').with(graphql());

const result = await client.query<Article[]>(`
query {
  articles(filter: { categories: { categories_id: { title: { _icontains: "category" } } } }) {
    id
    title
    sort
    categories {
      categories_id {
        title
      }
    }
  }
}
`);

using-search-method.js

fetch("https://directus.pizza/items/articles", {
  method: "SEARCH",
  body: JSON.stringify({
    query: {
      fields: ["id", "title", "sort", "categories.categories_id.title"],
      filter: {
        categories: {
          categories_id: {
            title: {
              _icontains: "category",
            },
          },
        },
      },
    },
  }),
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer mytoken",
  },
});