How Embedding GitHub Gist works in GoNevis.com

Document.write on Text Editor

Embedding GitHub Gist was painful in the editor for GoNevis.com.

For example, you want to embed via:

<script src="https://gist.github.com/Alir3z4/3557d3a78932992d705f0580647c74a4.js"></script>

That would cause annoying error:

Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.


GitHub Gist uses `document.write` and their JavaScript asset on the embed.

This question on Stackoverflow will help you understand better or the search result on DuckDuckGo.

How we solved it

There were many solutions to handle it, but most of them were not working for us properly, we needed it to have it working on 3 places:

  • Text Editor.
  • GoNevis Dash Reader.
  • Post Detail page on the blog .


What we did was, we made a proxy to handle it.

This issue has been solved by using a proxy which will not require any weird behavior while using the text editor on GoNevis Dashboard.

We created a page on GoNevis.com that will receive the GitHub Gist URL form the query parameters in the URL:

<iframe src="https://www.gonevis.com/toodartoo/embed/?media=https://gist.github.com/Alir3z4/3557d3a78932992d705f0580647c74a4">


That's basically it!

Pasting the GitHub Gist link into the editor would do the job pretty easy now.


Special thanks to Lars Fosdal to suggest GitHub Gist embedding feature and make us stop being lazy and implement it.

Happy hacking <3





Alireza Savand • 2018 Dec 18

Be the first to comment.

Forgot Password