microsoft / microsoft/node-api-dotnet

Supporting SSR scenarios

Open
#460 0 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
C#
Stars
783
Forks
80
PR merge metrics
No merged PRs in 30d

Description

One of my motivations to use this is for using my .NET server as a runtime for my React frontend. In order to do that, I need to execute SSR code through Node.js in .NET and I think the two options right now are edge-js and node-api-dotnet.

I've completed a prototype of supporting React Router SSR with node-api-dotnet here:

https://github.com/kamranayub/dotnet-ssr

However, I did run into a few issues:

  • Debugging doesn't work, since it's targeting net8.0 and there's an issue with that #440
  • You can't use the node-api-dotnet npm package vanilla within SSR context because the CLR host is already initialized #330

For the second issue, I've worked around it by patching the init.js manually and injecting a dotnetHost global, which works!

https://github.com/kamranayub/dotnet-ssr/blob/be9dc260c5cc23c31f037cc60e74872c7fd8d30a/web/patches/node-api-dotnet%2B0.9.15.patch

https://github.com/kamranayub/dotnet-ssr/blob/be9dc260c5cc23c31f037cc60e74872c7fd8d30a/src/server/NodeSsrHost.cs#L57-L71

I think this could be contributed back to the library, but not sure where/how to do that. I'm up for it if that would be accepted, I just need some guidance.

I haven't yet prototyped this with edge-js, I only know it also does in-proc communication -- what I don't know is if I can set it up like this so the SSR code can invoke .NET APIs, plus I love that this generates the typedefs which make this work great under Vite dev mode 🚀

To get that working, you need to rewrite the import paths at build time:

https://github.com/kamranayub/dotnet-ssr/blob/be9dc260c5cc23c31f037cc60e74872c7fd8d30a/web/vite.config.ts#L12-L65

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the linked prototype, especially its patched init.js, NodeSsrHost.cs, and vite.config.ts, along with issues #440 and #330. Clarify whether the intended contribution is reusable SSR support for an already initialized CLR host, build-time import rewriting, or both; done should be defined by an accepted design and working SSR coverage.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp, node.js, react, typescript, vite
Domain
backend, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.