Discord opengraph embeds not showing up from my website

Question

I am making a website that takes URL parameters and then creates meta tags accordingly from them. Discord is not displaying any embed.

Here is the code:

<!DOCTYPE html>
<html>
    <script>
        function getUrlVars() {
            var vars = {};
            var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
                vars[key] = value;
            });
            return vars;
        }
        
        var title = getUrlVars()["title"];
        var description = getUrlVars()["desc"];
        var color = getUrlVars()["color"];
        
        var td = document.createElement("meta");
        var tt = document.createElement("meta");
        var tc = document.createElement("meta");

        td.setAttribute("content", description);
        tt.setAttribute("content", title);
        tc.setAttribute("content", color);
        td.setAttribute("property", "og:description");
        tt.setAttribute("property", "og:title");
        tc.setAttribute("name", "theme-color");

        document.head.appendChild(td);
        document.head.appendChild(tt);
        document.head.appendChild(tc);
        
    </script>
</html>

Here is the website & result:

As you can see, no embed showed up. I am relatively new to HTML and DOM, so all help is appreciated.

score 0 · Answer 1 · answered Jul 11 '20 at 21:42

As far as I know, most web crawlers do not run JavaScript, they just read the HTML in the website.

So your best option, would be to use PHP. Thats what I did with my "user embed generator"

For example:

if(isset($_GET['title']) && !empty($_GET['title'])) {
    echo "<meta name='og:title' content='{$_GET['title']}' />";
}
// and so on with more open-graph tags

Discord opengraph embeds not showing up from my website

1 Answers1