如何在页面返回给请求者之前修改索引中的 HTML .html



根据我处理的自定义 URL 参数,我正在尝试动态修改我在索引中 id 的元标记.html如下所示:

<meta name="og:image" content="http://example.com/someurl.jpg" id="ogImage"/>

我家.ts中的以下代码似乎可以正常工作

document.getElementById('ogImage').setAttribute("content", Media.ImageURL) ;

我可以通过浏览器开发控制台/元素验证它。

但是,当我通过他们的 ojbect 图形调试器从 facebook 查看时 https://developers.facebook.com/tools/debug/og/object/

它似乎看到默认值

http://example.com/someurl.jpg

好像索引.html在我的 Home.ts 有机会进行更新之前就已经发布。

也许,我的理解是有缺陷的,有更好的方法可以做到这一点。 谢谢。

注意1:最初,我认为我必须在index.html和我的一个服务之间进行一些角度绑定,但我找不到任何示例代码,我最接近的是这篇文章 如何在 AngularJS 中更新元标记? 但是我不知道如何将它应用于我的ionic2/3代码,所以我选择了document.get方法。

注意2:这里的最终目标是将链接共享到社交媒体(网络或应用程序)中,如Facebook,像viber/Skype等信使等......并使其解析为有意义的图像,标题,描述,以通过浏览器或应用程序将访问带回网站,如果用户单击链接是在移动设备上,并且他的设备上安装了我的应用程序版本的网站。

注意3:如果您决定将我指向离子深度链接,请提供与上述匹配的代码,因为我无法理解如何应用于我的情况。

如果您尝试在页面中实现动态开放图形元标记值,则需要像 php 这样的服务器端脚本语言。 这样的脚本将在服务器上运行,根据需要更新页面,然后将页面提供给请求站点或应用程序。

客户端脚本(即JavaScript)通常被忽略,当一个网站或应用程序只是为了提取(又名报废,解析html)信息,例如由打开的图元标记(og:title,og:description og:image...)提供的信息。

最新更新