从非放大器html页面链接的amp-html页面无法正常工作

时间:2017-04-26 16:36:21

标签: amp-html

https://www.washingtonvoterfile.com是一个传统的html(不是amp-html)页面,其中包含指向amp-html页面的链接(例如:https://www.washingtonvoterfile.com/legal-notice.html)。

直接加载这些放大器页面时,它们会正确呈现,并且Google Chrome AMP验证器插件表明它们是有效的AMP。

当点击(非放大器)主页上的链接加载时,它们会在没有加载放大器的情况下进行渲染。 Google Chrome AMP Validator插件显示为灰色,表示它们不是AMP页面。

如果刷新,则加载amp.js并正确渲染。该插件显示AMP有效。

我尝试使用硬链接,相关链接等来解决此问题,但没有运气。

非常感谢任何输入。

更新

问题似乎是主页上使用的JQuery Mobile工作方式的结果。基本上,任何链接页面的head标签中的大多数项目都没有加载。

解决此问题的一个方法是,在正文标记(https://forum.jquery.com/topic/script-not-running-unless-i-refresh-page)中移动脚本标记,因为必须在head标记中加载放大器脚本,所以无法正常工作。

3 个答案:

答案 0 :(得分:1)

您在放大器页面中提供的链接是:

<link rel="canonical" href="https://www.washingtonvoterfile.com/legal-notice"/>

不存在。

如果您只有一个页面,并且该页面是AMP页面,您仍然必须添加规范链接,然后只是指向自己:

<link rel="canonical" href="https://www.washingtonvoterfile.com/legal-notice.html"/>

另外正如您所解释的那样,即使它们彼此没有连接,也会打开通过非放大器页面链接的放大器页面。


应该有两个页面,一个非放大器,它有一个指向放大器页面的规范标签。

<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">

并在amp-page中:

<link rel="canonical" href="https://www.example.com/url/to/full/document.html">

如果您只有一个独立的AMP页面,它应该如上所述链接到自己。

希望有所帮助!

答案 1 :(得分:1)

对我自己的问题的非常满意的答案是,从使用JQuery Mobile的页面链接到AMP页面没有好的方法,因为:

  1. JQuery Mobile并没有加载链接头标记中的大部分内容 页。
  2. amp.js不能按照AMP规则进入正文标记。
  3. JQuery Mobile和amp.js冲突,因此无法在主页上加载amp.js。
  4. 就我而言,我只是将AMP页面设置为非AMP页面。这个用例很好。如果我真的需要它们作为AMP,我需要在主页上重写搜索栏,这样我就不需要JQuery Mobile。

答案 2 :(得分:0)

您正在使用jQuery Mobile进行页面转换,但AMP Validator扩展程序仅在文档加载时运行。

为了支持这一点,AMP验证器可以监听popstate事件,但由于AMP页面应按原样加载,因此没有理由这样做。