Nextra - Search REST API implementation
Unanswered
Bombay posted this in #help-forum
BombayOP
I'm currently working on a Nextra project where i store my documentation, from my understanding, Nextra uses Flexsearch (by default, i'm not using any custom search system) to perform searches.
My plan is to have a rest api such as mywiki/api/search?query=something that would return the URLs for the top 5 results. While i've successfully setup the api endpoint, i'm at a loss as to how to import the Flexsearch into my api. Once that is imported i belive it's as easy as calling index.search(query) but i cannot find any documentation anywhere on how to achieve that.
My plan is to have a rest api such as mywiki/api/search?query=something that would return the URLs for the top 5 results. While i've successfully setup the api endpoint, i'm at a loss as to how to import the Flexsearch into my api. Once that is imported i belive it's as easy as calling index.search(query) but i cannot find any documentation anywhere on how to achieve that.
42 Replies
BombayOP
@linesofcode
I'm using the default nextra search that i belive is Flexsearch
the search itself is working perfectly well within the wiki itself, i just want an api endpoint to get search results from
linesofcode
One sec…
Let me read up on flex search
BombayOP
In short, i just want to pass discord messages to it and return top 5 results within discord
i have all the steps covered, except on how to actually search 😅
export default async function handler(
req: NextApiRequest,
res: NextApiResponse
) {
await runMiddleware(req, res, cors);
const { query } = req.query;
if (req.method === 'GET') {
if(!query) return res.status(400).json({ status: 'error', error: 'Query is required' });
//search inside documentation using nextra
const results = [query];
res.status(200).json({ status: 'success', data: results });
} else {
res.status(405).json({ status: 'error', error: 'Method not allowed' });
}
}not much point in this code but ye, i need to import the flexsearch instance in here somehow
linesofcode
when you say import flexsearch
is there an instance you've already created of it somewhere?
anyways the way I believe this would be done
BombayOP
that is the whole root of the issue
nextra is a black box i have no clue where it initializes flexsearch
linesofcode
is that you need to import/export an index containing your flexsearch data
BombayOP
if i could get the flexsearch instance there would be no problem, the library is pretty easy to use
linesofcode
__nextra_internal__.flexsearchidk if this is directly relevant
but I would begin by searching through the nextra codebase and figuring out how they interact with flexsearch
BombayOP
i don't see anything in the server side globalThis
this config option may also be helpful
you may need to fork this repo even
and try to hack in a way to get a flexsearch reference
good luck figuring this out!
BombayOP
@linesofcode i got something
this doesen't work
but this does
thanks for the tip, now to hunt if i can actually do something with it
this doesen't work
globalThis.__nextra_internal__but this does
const __nextra_internal__ = globalThis[Symbol.for('__nextra_internal__')]thanks for the tip, now to hunt if i can actually do something with it
linesofcode
Nice!
no problem
if you figure this out, I'd love it if you could be ping me with the final solution 😄
i might have to do something similar at some point
BombayOP
ye, digging into the nextra internal atm
BombayOP
unfortunatelly i only found the flexsearch options, which is what was in your first finding
the key is probably in the second section of code you linked, but i have no clue how to grab that
BombayOP
@linesofcode basically, all you would need to do is export this, but you'd need to hack the nextra source https://github.com/shuding/nextra/blob/bf2636a20a7b81a850476a549b73e1b6dc20c278/packages/nextra-theme-docs/src/components/flexsearch.tsx#L48
i haven't found a way to access it any other way
if only this comment was implemented lol
// This can be global for better caching.BombayOP
@linesofcode as a closing to this, i basically had to reimplement the whole flexsearch api-side
linesofcode
Ahhh
fuma 💙 joulev
As I know, Nextra do this at client-side.
I had implemented a search for my framework: https://next-docs-zeta.vercel.app/api/search?query=hello
It is just built with Flexsearch, you can use it as a reference (the project is open source)
I had implemented a search for my framework: https://next-docs-zeta.vercel.app/api/search?query=hello
It is just built with Flexsearch, you can use it as a reference (the project is open source)
Nextra actually do:
1. They first compile all mdx files, extract headings, text and store it in cache (under .next folder)
2. Load documents in [Flexsearch](https://github.com/shuding/nextra/blob/main/packages/nextra-theme-docs/src/components/flexsearch.tsx) component
1. They first compile all mdx files, extract headings, text and store it in cache (under .next folder)
2. Load documents in [Flexsearch](https://github.com/shuding/nextra/blob/main/packages/nextra-theme-docs/src/components/flexsearch.tsx) component
BombayOP
Ye this is what I ended up doing