Letting users write in MDX? (Would it be practical and safe?)

[bakerfugu]

I'd like for my users to be able to be able to write content in MDX, and I'm curious about how crazy I am.

For example, I want my users to make a blog post where they can type in markdown but also embed React components. So letting them write in MDX seems awesome.

However, I don't know how practical and safe this would be.

• The first complication is that MDX is prebuilt. I believe the practicality isn't too big of a hurdle based on this page, but I could be missing a step.
• For the second complication of safety, I'm concerned about XSS and other similar issues with what feels like letting users write code. Does the mdx compiler do some form of containment/sandboxing, and/or is there a way to restrict what components could be imported?
• Are there any other reasons why this would be a bad idea?

[wooorm]

Reframing the question: “Letting users write in JavaScript?” might help you figure it out.

In short: no, it’s not safe, it’s dangerous.

There are of course places online where you can write code, e.g., runkit, codesandbox, which is evaluated in a sandbox. You could do something like that.

[remorses]

You can use safe-mdx or hast-util-to-jsx-runtime to render MDX without eval and make it safe to run the user code in your server (at least if all the components you give the user access to are safe too)

[ChristianMurphy]

@remorses thanks for sharing!

Taking a step back.
A consideration I'd raise to folks, a lot of the power in MDX is its flexibility, the things which are very unsafe like imports and expressions, without that what's left is largely plain Markdown, which raises the question: why not use plain markdown? 😅

For folks who do want to take that trade off and use a narrow safe subset of MDX.
"safe" is nuanced, there is a lot to check, a lot of sanitation is needed, and that can be a dynamic and changing landscape of managing risks.
@remorses you may want to add a security policy to the repo https://docs.github.com/en/code-security/getting-started/adding-a-security-policy-to-your-repository for how to folks to communicate risk to the project.