如何在自定义AMP页面禁用浏览器后退按钮并解决索引报错？

问题根源 #

你之前添加的普通<script>标签不符合AMP规范，AMP对脚本有严格限制，非官方允许的脚本必须使用指定组件包裹，否则会触发“HTML标签缺少必填属性”的报错。

合规解决方案（使用AMP官方支持的amp-script组件） #

1. 先在页面头部引入amp-script组件的依赖脚本：

   <script async custom-element="amp-script" src="https://cdn.ampproject.org/v0/amp-script-0.1.js"></script>
   

2. 用amp-script包裹你的后退禁用逻辑，内联脚本需要放在type="text/plain"的标签中并指定ID：

   <amp-script layout="container" script="back-button-disable">
     <script type="text/plain" id="back-button-disable">
       history.pushState(null, null);
       window.addEventListener('popstate', function(event) {
         history.pushState(null, null);
       });
     </script>
   </amp-script>
   

注意事项 #

• amp-script对内联脚本的大小限制为15KB，你的脚本完全符合要求；
• 禁用后退按钮可能损害用户体验，Google的跳出率计算还包含其他行为，过度干预可能带来负面效果，请谨慎使用；
• 确保页面其他部分也严格遵循AMP规范，避免其他索引报错。

内容的提问来源于stack exchange，提问作者info indo