-
Notifications
You must be signed in to change notification settings - Fork 248
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Help needed: How do I use this for facebook open graph meta. #133
Comments
Did find an issue ? I'im trying to do the same and I'm getting the same errors.. Thx :) |
@deadelus no one's answering yet. |
I found an issue here jvandemo/angular-update-meta#13 |
@deadelus nice, thanks! |
Try this one too : https://github.com/chrisvfritz/prerender-spa-plugin |
Thanks!
…On Tue, Nov 14, 2017 at 11:32 AM, Trambolho Geoffrey < ***@***.***> wrote:
Try this one too : https://github.com/chrisvfritz/prerender-spa-plugin
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
<#133 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AIPPI-N8PTTlV6EgHgeBZGBMFMGSS1P2ks5s2Qm-gaJpZM4PFZ1R>
.
|
Need a simpler solution than using SSR... |
add quotes and move vmid to the end
|
Any solution for this? I have tried using prerender-spa-plugin. My site is showing the open graph meta tags, however facebook debugger is not crawling my metas? |
@kont-wayfinder You should check to see if the tags are being rendered without JS. |
Is this vue-meta working with facebook? If not i won't even install it |
This is not an issue with
All options have trade-offs, but 3) above means adding code elsewhere and not changing anything you've already got which for me, is a good solution as I can continue to write the rest of my app without the intricacies of SSR or Pre-rendering. However, you need to choose something for your situation. Just as an aside, most search engines these days will actually run Javascript when they're indexing your site, so |
Potentially stupid question -- but how do you detect when a crawler is hitting your site? |
When a request is made to your site you can check the user-agent header in the request for the user agents used by which ever social networks you want to share with. For example, Facebook: |
Awesome, thank you! |
How we can do it in VUE JS? @SamJWeissman Have you found any way to do it? |
@eluminous40 Unfortunately, you can't right now. Social media crawlers currently do not run Javascript when they scrape your site for meta info. For Vue to have any hope of doing this, the crawlers need to either run Javascript or you need to render your page before the browser using either server-side rendering or pre-rendering. |
@smcstewart , Thank for reply. Do you have any idea how we can make it possible in VUE JS? |
@eluminous40 Short of getting the social media crawlers to run Javascript before they scrape content, no. Common problem with SPAs based on Javascript, not just Vue. |
My project from the beginning has been broken up into two projects, the client side and server side code. I didn't want to completely swap over to server side rendering so I implemented a semi-hacky solution. With that being said, I'm not positive the implications my changes will have on search results in the future. But for rich previews, it works fine. My front end is served using Express, so I added a small bit of logic to check whether the request is coming from a crawler. If it is, I make a request to "preview routes" that exist on my server side code. The preview routes fetch whatever data is required, and then send pre-constructed HTML ( essentially, the meta tags I need for a rich preview ) back to the front end. Not necessarily the greatest solution, but it works fine in the meantime until I can go back and potentially re-implement server side rendering as a whole. |
Another 3 options:
|
@robsonsobral prerender is the way. One of our website uses it. www.fortcupine.com |
@jofftiquez Will prerender work for dynamic data ? For example if you have a list of products in your website that might change frequently. |
@coolemur as far as what I have experienced, no, it doesn't accommodate dynamic data. If that's the case, you might want to consider SSR instead. |
@coolemur , yes, it does. You can set |
@robsonsobral Interesting, how will it behave if I, say, requested a new list of data from the server? |
If prerender find You can add |
@robsonsobral nice! Thanks! |
There isn't a way to when facebook checks your link to find meta info to run some restfull code in the server side with a facebook's request then send it a response with the meta infos of that paga?!!!! This should be a simples link request from facebook what would contain the id of the dynamic data, so in our server we could handle it then respond with meta info. Is that possible?! |
Well, but how does facebook send this request when it finds my http link in his site?! |
and how does it require the answer to be? |
Client Side Receiving Request:
|
I implemented the proposed solution of detecting the social media crawler in Express, as @SamJWeissman did. Here is what I did if it helps someone: Vue app Express server
API Express server
I passed the However, now I have abandoned this solution and instead I do prerendering to tackle the issue and at the same time improve SEO. |
Currently I am trying :
But whenever I test it with fb open graph debugger it can't scrape the meta information.
The text was updated successfully, but these errors were encountered: