Third party embeds (YouTube, etc)

[YousefED]

While users can add videos, images, etc to BlockNote documents, it would be nice to support and embed content from third party providers, like youtube / vimeo / oembed / etc. Could also consider integrating a service like https://iframely.com

(Note that it is already possible to integrate something like Uppy and Upload content from third parties, see example: https://www.blocknotejs.org/examples/ui-components/uppy-file-panel. However, this is a different feature from detecting and embedding content from third parties directly)

We've seen some requests for this feature, but don't directly need it ourselves. If you require this feature, please consider sponsoring the project and we'll prioritize it

[virgile-dev]

How about we start listing the things we want embeds for and then list them in order of importance :
Vidéo

• Youtube
• Vimeo
• Peertube

Google

• Slides
• Docs
• Sheets
• Drawings

Whiteboards

• Miro
• Lucid
• Excalidraw
• Drawio

Kanban

• Trello

Databases

• Notion
• Grist

Maps :

• uMap
• OpenStreetMap
• Gmaps

@YousefED what are your thoughts about link rendering (GH, Drive Docs etc.) is it a related topic ?

[yenaing-dev]

During the enhancement is in-progress state, can I make the embed tab as disabled state in the video upload dialog?

[SiljaTorki]

Is there any update on this feature?

[virgile-dev]

Hey @YousefED
Anto has been working on this Docs side using our backend to define permissions for each allowed domain to be displayed in frame.
Just a POC for now. But is this something you're planning to make in BlockNote or should go build this on our end ?
Here is the PR suitenumerique/docs#2513

[gsingh-ds]

@virgile-dev How are allowed domains enforced? Is this only a UI restriction, or is it validated on the backend as well?
If you're using Yjs, is the backend reconstructing the document to verify that the requested domains are actually allowed? or is that enforced through Content-Security-Policy? or it is just simple enforcement in plugin and I am complicating it?

[virgile-dev]

It's enforced on the backend (django in our case).

[YousefED]

We're planning to work on this as part of a different project the upcoming 12 months or so. To do this well, I think it's good to realize a good embedding feature extends beyond adding an iframe-enabled block. For example:

• afaik (requires research), just frame embeds don't always offer the best UX
• we should detect embeddable content when the user types / pastes an URL in the editor
• We might want to present embeddable content in different forms (and / or let the user choose). E.g.: as URL / as inline "mention" / as small link preview / as full embed
• Finally, there's also the topic of authenticated embeds. You might want to embed content from an website behind a login system. Ideally, we'd also provide an API surface to make this possible

In the meantime, of course an iframe embed works.

[virgile-dev]

That's great news. I'll keep that in mind while thinking how we go about his in Docs.