typesense / gatsby-plugin-typesense

A Gatsby plugin to automatically index content to Typesense post-build
Apache License 2.0
34 stars 11 forks source link

Always getting a 404 - Not found response #13

Closed Richacinas closed 2 years ago

Richacinas commented 2 years ago

Description

I always get a 200 response with this content:

{
  results: [
    { 
      code: 404,
      error: "Not found."
    }
  ]
}

I'm not sure if this error means that there is no coincidences on my search, or that the root resource is not found. I understand that is the server the one answering, so I guess I'm doing my request right.

Steps to reproduce

My Typesense server is started using docker. See this part of my docker-compose.yml:

version: '3.6'

services:
  typesense:
    container_name: typesense
    image: 'typesense/typesense:0.22.0.rcu7'
    entrypoint: sh -c "/opt/typesense-server --data-dir /data --api-key=86c5153b35cf --enable-cors"
    ports:
      - '8108:8108'
    volumes:
      - ./typesense-data/:/data
...

Having this gatsby-config.js (I made it so you can see the important part):

{
      resolve: "gatsby-plugin-typesense",
      options: {
        rootDir: path.resolve(__dirname, '../theme/wordpress/public/es-es'),
        collectionSchema: {
          name: "category",
          fields: [
            {
              name: "category_name",
              type: "string",
            },
            {
              name: "page_path",
              type: "string",
            },
            {
              name: "page_priority_score",
              type: "int32",
            },
          ],
          default_sorting_field: "page_priority_score",
        },
        server: {
          apiKey: "86c5153b35cf",
          nodes: [
            {
              host: "172.20.27.226",
              port: "8108",
              protocol: "http",
            },
          ],
        },
      },
    },
    {
      resolve: `gatsby-plugin-typesense`,
      options: {
        rootDir: path.resolve(__dirname, '../theme/wordpress/public/es-es'),
        collectionSchema: {
          name: "brand",
          fields: [
            {
              name: "brand_name",
              type: "string",
            },
            {
              name: "page_path",
              type: "string",
            },
            {
              name: "page_priority_score",
              type: "int32",
            },
          ],
          default_sorting_field: "page_priority_score",
        },
        server: {
          apiKey: "86c5153b35cf",
          nodes: [
            {
              host: "172.20.27.226",
              port: "8108",
              protocol: "http",
            },
          ],
        },
      },
    },
    {
      resolve: `gatsby-plugin-typesense`,
      options: {
        rootDir: path.resolve(__dirname, '../theme/wordpress/public/es-es'),
        collectionSchema: {
          name: "product",
          fields: [
            {
              name: "product_name",
              type: "string",
            },
            {
              name: "page_path",
              type: "string",
            },
            {
              name: "page_priority_score",
              type: "int32",
            },
          ],
          default_sorting_field: "page_priority_score",
        },
        server: {
          apiKey: "86c5153b35cf",
          nodes: [
            {
              host: "172.20.27.226",
              port: "8108",
              protocol: "http",
            },
          ],
        },
      },
    },

And, considering I have my pages stored in the rootDir folder:

image

Containing some dom elements inside like this one:

<h1 data-typesense-field="category_name" class="whatever">Abrigos</h1>

And this React component:

import { InstantSearch, SearchBox, Hits, Stats } from "react-instantsearch-dom"
import TypesenseInstantSearchAdapter from "typesense-instantsearch-adapter"
...

const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter({
  server: {
    apiKey: config.typesenseApiKey,
    nodes: [
      {
        host: "172.20.27.226",
        port: "8108",
        protocol: "http",
      },
    ],
  },
  // The following parameters are directly passed to Typesense's search API endpoint.
  //  So you can pass any parameters supported by the search endpoint below.
  //  queryBy is required.
  collectionSpecificSearchParameters: {
    category: {
      queryBy: "category_name",
    },
    brand: {
      queryBy: "brand_name",
    },
    product: {
      queryBy: "product_name",
    },
  },
})
const searchClient = typesenseInstantsearchAdapter.searchClient

const Hit = ({ hit }) => (
  <p>
    {hit.title} - {hit.description}
  </p>
);

const Search = () => {
  return (
    <InstantSearch searchClient={searchClient} indexName="category" >
      <SearchBox />
      <Stats />
      <Hits hitComponent={Hit} />
    </InstantSearch >
  )
}

I'm getting the response 404 - Not found

Here you can see the network request that is being used:

http://172.20.27.226:8108/multi_search?x-typesense-api-key=86c5153b35cf

{"searches":[{"query_by":"category_name","sort_by":"","highlight_full_fields":"category_name","collection":"category","q":"abrigo","facet_by":"","page":1}]}

Expected Behavior

When I search, for example, "Abrigo", I would expect the server to return some hits.

Actual Behavior

I always get the response I mentioned above.

Metadata

Typsense Version:

I have followed this guide: https://medium.com/swlh/building-a-search-bar-for-your-gatsbyjs-site-with-typesense-3e277dc33942

So I have a typesense server started with docker, which version is typesense/typesense:0.22.1.

On the client, I have:

"typesense-instantsearch-adapter": "~2.2.0",
"gatsby-plugin-typesense": "~0.3.0"

OS:

Ubuntu 20.04LTS on WSL (Windows 10)

jasonbosco commented 2 years ago

@Richacinas Thank you for the detailed issue description! Could you confirm that you've also run gatsby build, which is what triggers the Typesense Gatsby plugin to scan the output dir and index content into Typesense.

If you have indeed run gastby build, could you share the output of that command, curious to see if any errors / warning are logged there.

Richacinas commented 2 years ago

Hi @jasonbosco . I didn't know about that!

I have only tried running gatsby develop, so your suggestion looks promising.

As soon as I try it (if not today, it will be tomorrow for sure), I'll let you know here.

Thanks a lot

Richacinas commented 2 years ago

Hi again.

Sorry if I wrote it in the wrong place. I opened another issue on Typesense:

https://github.com/typesense/typesense/issues/505

Basically, after running npm run build I'm getting an error saying that my fields cannot be found in the collection schema.

Richacinas commented 2 years ago

I would like to share my directory structure, so you can see maybe where the problem is:

image

I have a lot of pages like this one, some of them have category_name as a data-typesense-field, others have brand_name and others have product_name.

I have those 3 definitions of schema in my gatsby config as you can see above.

What could then the problem be?

Thanks again

Richacinas commented 2 years ago

Some news.

I changed the gatsby config to only one collection:

{
      resolve: `gatsby-plugin-typesense`,
      options: {
        rootDir: `${__dirname}/public/es-es`,
        collectionSchema: {
          name: "pages_v1",
          fields: [
            {
              name: "category_name",
              type: "string",
            },
            {
              name: "brand_name",
              type: "string",
            },
            {
              name: "product_name",
              type: "string",
            },
            {
              name: "page_path",
              type: "string",
            },
            {
              name: "page_priority_score",
              type: "int32",
            },
          ],
          default_sorting_field: "page_priority_score",
        },
        server: {
          apiKey: "86c5153b35cf",
          nodes: [
            {
              host: "localhost",
              port: "8108",
              protocol: "http",
            },
          ],
        },
      },
    },

And now I'm getting this error...

[Typesense] Could not create document: Error: Request failed with HTTP code 400 | Server said: Fieldproduct_namehas been declared in the schema, but is not found in the document.

jasonbosco commented 2 years ago

@Richacinas If that field is not found on all pages, you want to set that field as "optional": true in the schema, right after defining its data type.

Richacinas commented 2 years ago

Hi again.

That worked, and now it looks like my whole setup is correct, except for one thing. I'm trying to build on a local environment, where my SSL certificates are self signed, and at the end of the process I get this error:

warn Request #1643904569511: Request to Node 0 failed due to "CERT_HAS_EXPIRED certificate has expired"
warn Request #1643904569511: Sleeping for 0.1s and then retrying request...
warn Request #1643904569511: Request to Node 0 failed due to "CERT_HAS_EXPIRED certificate has expired"
warn Request #1643904569511: Sleeping for 0.1s and then retrying request...

 ERROR

[Typesense] Could not create collection pages_v1_1643904569510: Error: certificate has expired

not finished onPostBuild - 0.284s

Is there any way to make it accept my self signed certificate?

Thanks

jasonbosco commented 2 years ago

@Richacinas You would have to add your self-signed cert to the root certificate store in your OS, to get the certificate to be trusted. Something like this or an equivalent article might work.

Richacinas commented 2 years ago

After following similar steps (I'm running wsl Ubuntu on Windows) to create a self signed certificate that is trusted on the local machine, I also had tu run the process like this in order to make it work (otherwise I got a similar error):

NODE_TLS_REJECT_UNAUTHORIZED=0 npm run build

jasonbosco commented 2 years ago

Thank you for documenting that!