Access loaders data from different clients using fetch

[spacepolice10]

Hi there,

Is it possible to access JSON data through await fetch request made from client-side component or from different application? Right now if I try to fetch loader (like fetch(**ROUTE_URL**).then(data => data.json())) by its URL I receive the whole page (HTML) which is, I guess, correct but I would like to access JSON returned from loader via fetch. That will simplify making React Native version of application by exploiting Remix version as a backend. Any way to achieve something like that?

[sergiodxa]

You can use a resource route for that https://remix.run/docs/en/main/guides/resource-routes.

For UI routes you will need to use an internal ?_data=routeId search params or if you use single fetch .data?_route=routeId. Since this is already going to change in single fetch and may change again in the future without being a breaking change (it’s an internal implementation detail), the recommended way is to use a resource route.

[spacepolice10]

That sounds extremely interesting. Thanks for sharing & sorry to bother y'all again, but I feel like I don't really understand the conception. Do you read header in your express application, match route there & call certain loader (resource loader) right there (if so, how is it possible to activate loader is such a way before RemixRouter is in charge?)

[kiliman]

It'll be part of my Vite+Express plugin. It bundles your Express app with Remix so they have access to the same modules. It's also how I support Remix Middleware.

https://github.com/kiliman/remix-express-vite-plugin

[spacepolice10]

You mean that in future your package will by default intercept routes and return correct data depending on whether the request made by fetch or document?

[kiliman]

Yes, but it'll most likely be an opt-in since it would change the existing semantics.

[spacepolice10]

Sounds awesome. Starred the project, so I know when it is released. Look forward to try out this feature. Thanks