HTML meta tags not scraped

0
Hello,   My goal is to generate a nice link preview when someone shares the app url on LinkedIn or other social media (with a title, description, image etc.). To achieve this, one needs to add some open graph meta tags as described here: https://www.linkedin.com/post-inspector/inspect/https:%2F%2Fwww.meetup.com%2F   So I’ve added an HTML snippet on the login page of my app in order to add the meta tags to the HTML head using javascript: var description= document.createElement('meta'); description.name = "description"; description.setAttribute("property", "og:description"); description.content = "My description."; document.head.appendChild(description); var title = document.createElement('meta'); title.name = "title"; title.setAttribute("property", "og:title"); title.content = "My Title"; document.head.appendChild(title); var url = document.createElement('meta'); url.name = "url" url.setAttribute("property", "og:url"); url.content = "https://myurl.mendixcloud.com"; document.head.appendChild(url); var image = document.createElement('meta'); image.name = "image"; image.setAttribute("property", "og:image"); image.content = "My image link"; They are added correctly as you can see here:   However, the LinkedIn Post inspector is not picking up the properties after I have deployed my changes (and it’s not a cache issue either). This leads me to believe that something is interfering. What I’ve tried so far is to delete the X-Content-Type_Options HTTP header in the dev portal (it was set to nosniff before) but unfortunately that didn’t resolve the issue.   Any ideas?        
asked
1 answers
0

If you View Source you’ll see the tags aren’t on the page as LinkedIn sees it, but are instead in the DOM as your browser has it. This is because you are adding the elements via JavaScript and I don’t believe the LinkedIn scraper executes JavaScript (some other scrapers do though).

One solution would be to modify your index.html file to manually include a set of generic elements that LinkedIn and other scrapers can read without executing JavaScript. These would be universal throughout your application.

Another solution could be to create custom pages for scrapers to visit that have the correct metatags in the returned HTML. There is a write up on how to do this on this blog post. It’s rather old, so may not be up to date.
http://www.mxblog.eu/p/post/2533274790396705

Hope this helps.
 

answered