how to test open graph on localhost

吃可爱长大的小学妹 提交于 2019-12-18 11:15:17

问题


I've done a lot of research and haven't found a definitive answer to this. Is there anyway to test the open graph on localhost? I don't haven any issues using the graph api on locahost.

I've changed my website url in the app settings and have even tried setting up a domain in my hosts file but the debugger linter for open graph tries to use the actual domain instead of my localhost and when using locahost directly the linter completely fails connecting.

Does anybody have any workarounds for this?


回答1:


Using a local proxy is the right solution. ngrok didn't work for me neither.

A similar tool that did work with facebook debugger is localtunnel

npm install -g localtunnel
lt --port 8000

Generates a url that looks something like https://<random_hash>.localtunnel.me/. Using this url in facebook open graph debugger worked for me as of October 18th 2017. I only had to hit Fetch new scrape information button. 🍻

Cool thing about localtunnel is that you can easily host your own localtunnel server with github.com/localtunnel/server so if it ever stops working with localtunnel.me, you can run your own somewhere in the cloud




回答2:


You can use ngrok to create a random public subdomain that routes to your local webserver very easily, even through NAT or firewalls.

Just download ngrok and run ./ngrok http 8080 (assuming 8080 is your local webserver http port).

This will create a random subdomain like http://38a84a97.ngrok.io/ that routes to your local webserver and that you can use with Facebook to test your open graph tags.




回答3:


Its very simple to test Open Graph in any local environment using Chrome which you will be using if you have a localhost. I have used this to quickly show in chrome how the Open Graph looks to the viewer to test results. Here is a quote of what it does.

This extension shows how people will see your site in the most popular social networks This extension is for professionals who creates a media content.

To check meta-information of your site or article just open it in a Chrome and click extension's icon. Also you could add an URL manually.

Here is a direct link to the plugin




回答4:


To test open graph (and Twitter cards) I also had to expose localhost (Docker) to Facebook and Twitter. I used Serveo

It works very well for this, no need to install anything as it works with ssh port forwarding.

$ ssh -R 80:localhost:3000 serveo.net

Then navigate to the url given, and there you go.




回答5:


You have to setup a public domain which points to your public ip address. Use dynes.org or a similar service and setup your router to forward your port 80.




回答6:


I use a free tool called ProxyLocal that makes my localserver accessible by the public.

Checkout this guide for other proxy alternatives http://devblog.avdi.org/2012/04/27/http-forwarding-services-for-local-facebook-development/




回答7:


There are several tools you can use for serving something up over your localhost, each with varying degrees of functionality.

I prefer (obviously) http://forwardhq.com

Other great options here: http://devblog.avdi.org/2012/04/27/http-forwarding-services-for-local-facebook-development/




回答8:


If anyone is looking to preview the :og tags on while developing on subdomains (using lvh.me) in localhost. You can use https://serveo.net. Simply use following command to forward your local server requests. No installation required.

ssh -R yoursubdomain.serveo.net:80:yoursubdomain.lvh.me:3000 serveo.net

you can put your desired port in place of 3000.

Reference: https://blog.aarvy.me/2019/09/20/expose-local-apps-having-subdomains-to-web/



来源:https://stackoverflow.com/questions/8569892/how-to-test-open-graph-on-localhost

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!