如何使用 AngularJS 或 javascript 创建链接的 liveurl 预览，并使其可点击？ [关闭]答案

【问题标题】：How to create a liveurl preview of link using AngularJS or javascript, and make it clickable? [closed]如何使用 AngularJS 或 javascript 创建链接的 liveurl 预览，并使其可点击？ [关闭]
【发布时间】：2016-12-05 12:42:11
【问题描述】：

我确实有一个 textarea 元素，并且我使用 angular 进行数据绑定。我想捕获用户输入的字符串中的 url，并生成该 url 的可点击实时预览。关于如何使用 AngularJS 或 JavaScript 完成此任务的任何想法？就像脸书一样。谢谢！

【问题讨论】：

我不认为您可以在客户端执行此操作，但如果可以，它将需要以某种方式获取目标页面并以某种方式呈现。我几乎可以肯定，其他这样做的网站使用 ajax 调用来让他们的服务器完成繁重的工作。
Solarshado 和@Martin 我仍在集思广益并阅读一些关于开放图的材料。我遇到了这个 open-graph-scrapper，它最终可以让我从 URL 中获取所有元数据，然后使用指令生成带有标题和描述的实时屏幕截图，所有这些都可以点击。我正在尝试看看如何实现所有这些。
我正在处理同样的问题。我过去使用过 LiveURL，但图像和标题字段已更改，因此不再正常工作。但是，我找到了一个 API 服务，它以每小时 x 的数量免费提供。你想要linkpreview.net
@Darren Street 感谢您的回答，非常有帮助，这回答了我的问题。同时，我会继续寻找免费的 API 服务，或者看看如何自己编写代码。非常感谢

标签： javascript angularjs cordova ionic-framework firebase

【解决方案1】：

您需要一些服务器来为您执行此操作。

您可以使用公共服务，例如 https://screenshotlayer.com/、https://www.url2png.com/ 或者您可以使用以下库之一运行您自己的服务器：https://github.com/brenden/node-webshot 或 https://github.com/vbauer/manet

【讨论】：

我只是看了这些服务和API，看起来他们只提供截图。我可能错了，但这是我的第一印象。我说的对吗？
如果这不是你问的那我误解了你的问题，请澄清你的意思
当然！我正在尝试找到一种方法来从文本区域检测 url，提取元数据，然后生成带有标题和描述的可点击实时预览。就像我们在 Facebook 中分享/发布链接一样。