It'll depend on the system doing the scraping. If it's just fetching the HTML with curl or similar, using the meta tag shouldn't be any different. I'm not familiar with HTML parsers that follow meta redirects.
But if the scraper is using Puppeteer, either approach will result in the redirect being followed and the Open Graph data being ignored.
This is normally the behavior you want from a scraper: if someone pastes a bit.ly / t.co link you want the link preview to show data on the other side of the redirect.
You could try to figure out how to distinguish between a scraper and a human operator, but that'll be tough, since people work very hard to make Puppeteer look 100% legit.
While this is how web scrapers work, this post is targeted at url unfurlers, which have different goals and almost never follow redirects. Facebook, slack, etc, have documentation publicly available on how their unfurlers work: most effectively just curl the html then parse meta tags
This is probably and edge case you don't need to worry about. For the most part, you can rely on the user agent for a scraper that cares about these meta tags to identify itself as a bot (e.g. twitterbot). Since meta tags are machine, not user, facing, I don't think there's much of any benefit in trying to serve the meta tags to a bot that is intentionally trying to emulate a human.
Curious if there's reasoning against just checking the user agent and sending back the HTML with OG tags for them, but then straight up HTTP redirecting in all other cases?
I feel like any reputable agent calling for open graph stuff is going to be labeled correctly, though I'm open to being wrong.
As someone who never uses Slack, Discord nor Facebook (mostly IRC), how does a HN link look if you're not using that service? I'm not sure I understand the difference, is it just the icon/image on the right/below that is different?
Aha, so the added information is number of votes (at indexing time? Reading the chat message time?), comments, relative timestamp and the logo is at the right instead of below with absolute timestamp. Got it, thanks!
I’d suggest adding captions or titles to the screenshots. At present it’s just 4 screenshots. Not at all clear that some are with/without, or what each represents.
I like the idea and would use it. But the readme doesn’t give me that context, only the additional comments made here.
Ah, the other comments implied that it was their staging environment for testing new features or something, but that appears incorrect. Now that I'm matching HN names up with Github names, it all makes sense.
I personally wouldn't register someone else's domain with a 1 on the end, just because of fear of trademark law, but I guess it worked out this time.
I also wish it provided upvote and downvote totals, and not solely the final score - it'd allow more a lot more experiments of differing ways to display threads and comments.
I wouldn’t mind having this as an official feature, TBH. It’s just a few meta tags and makes it a lot easier to figure out if the link is worth following in Slack/Teams/etc.
Sure thing! Also check out https://socialsharepreview.com/ which is great for larger social previews. I chose to go the more compact route for these previews because a giant orange "Y" logo for every link isn't very helpful.
You're technically right, if a lot of people use this, the owner of ycombinator1.com will have a lot of info about who shares which URLs and could actually change the redirects to whatever they want.
That being said, it's probably not much of an attack surface given the transient nature of the links.
As of right now, I have almost zero information about who is using it. It's currently running on Vercel as a hobby project, and I've already used my single free analytics add-on for another project.
(Will I run out of free Vercel function execution credits or whatever? Probably. We'll see, I guess.)
EDIT: Vercel gives me a realtime function log but it's pretty basic and has no statistics: https://cln.sh/WlXBSY
Super handy! You solved a pain point I had. I sometimes want to drop HN links in Slack, but the lack of preview makes me hesitate or forces me to go an extra step and set a name on the link.
The redirect is for the humans.
The page that does the redirect is for the applications, like Slack and Twitter. They will use the meta tags on that page to show a "social media preview".
Would have been helpful for OP to mention that in the summary. I also couldn't figure out what it did. I just clicked the links and they redirected. No clue what a "fancy social preview" is.
It looks like this only adds social graph info but is otherwise a redirect. The resulting page looks like