[SEO Utils on Steroids] Facebook Crawlers not getting the metadata
Forge component by João Marques
Application Type
Reactive

Hello,

I am having some trouble to use this component on react application.

The metadata is indeed added to the page, but i am afraid that, either it is added to the page too late, or the facebook crawler engines don't allow javascript execution (discussed on this post https://stackoverflow.com/a/7623986)

Any idea on this? From what i read, the only way to do this was if we had the "Escaped content" feature of the traditional web expressions, or if outsystems HTML element allowed the "meta" name.

Thank you,

Vasco Mendes

mvp_badge
MVP

Hi Vasco,


Thanks for bring this situation to our attention.


I checked with other crawlers and indeed the metas are not fetched.
I guess because when the request is not run with a client browser, the OnInitialize and OnReady events do not run. The same thing happens calling the page via PostMan for instance.


I am going to investigate other ways in which this can be achieved and will let you know.


Best regards,

João

Hi João, Vasco,

Reactive apps work as Single Page Applications, where most of the content is created by JavaScript in the browser. Some crawlers, like google search engine, work correctly with this (they use browser-like JavaScript engines to run the code on the page on their side). Others, like Facebook (which ironically created React) do not yet support that.

At OutSystems we are currently investigating the possibility of having SEO Friendly URLs available in reactive apps. We'll also take a look into this scenario to see if there is any possible workaround for these crawlers shortcomings, although at this point in time we can't promise anything.

Cheers,
Tiago Simões

Hi! Any updates on this issue? I was thinking about using the same component but I'm afraid I will run into the same error...

Hi Luís,

The team is currently working on making it easier to change the URLs of the screens. Regarding optimizing for crawlers other than google, there are some external services (e.g. https://www.prerender.cloud/,  https://prerender.io/) that you might be able to use to help on that.

Cheers,
Tiago Simões

Just to be more clear (sorry for my previous short comment), I ran into this issue when trying to improve the looks of my application's links, when shared via social networks (Facebook, Whatsapp, etc). 

I was specifically trying to add an image preview, but then noticed the other meta tags aren't working either (according to: https://developers.facebook.com/tools/debug/), despite when inspecting the page (via chrome dev tools), I am able to see them. 

I am currently not using any plugins or components, I am simply appending the meta tags using a set of client actions that run inside the 'OnReady' event of the page's screen (Reactive Web Application).

"Reactive apps work as Single Page Applications, where most of the content is created by JavaScript in the browser. Some crawlers, like google search engine, work correctly with this (they use browser-like JavaScript engines to run the code on the page on their side). Others, like Facebook (which ironically created React) do not yet support that."

Are you telling me that SEO Friendly URLs are not yet available in reactive apps in Outsystems? I have run into several react-based solutions that use the 'react-helmet' package, don't know if you have considered this. Are there any known workarounds other than the one you mentioned (https://www.prerender.cloud/)? I am not interested in using external services. Thank you in advance.

Hi Luís,

Yes, SEO Friendly URLs are not yet available in reactive, but will be available soon as a technical preview. We'll also investigate further yours and other similar scenarios related to crawlers, but to be honest we can't yet promise anything on that area.

Thanks,
Tiago Simões

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.