AMP 不允许加载图像

maf*_*tis 1 amp-html amp-img

\n\n

我正在尝试在我的应用程序中使用AMP。我可以通过以下方式获取图像:

\n\n
<img src="{{url(\'storage/images\')}}/{{$post->image}}" alt="{{$post->title}}" class="img-fluid">\n
Run Code Online (Sandbox Code Playgroud)\n\n

但由于我添加了 AMP,它们将不再加载:

\n\n
<amp-img src="{{url(\'storage/images\')}}/{{$post->image}}" alt="{{$post->title}}" class="img-fluid"></amp-img>\n
Run Code Online (Sandbox Code Playgroud)\n\n

知道发生了什么吗?

\n\n

更新1

\n\n

这是我添加到我的网站标题中的内容:

\n\n
<html amp lang="{{ app()->getLocale() }}">\n<!-- amp -->\n    <script async src="https://cdn.ampproject.org/v0.js"></script><!-- must besecond child -->\n    <link rel="canonical" href="{{url()->current()}}">\n    <script type="application/ld+json">\n      {\n        "@context": "http://schema.org",\n        "@type": "NewsArticle",\n        "headline": "Open-source framework for publishing content",\n        "datePublished": "2015-10-07T12:02:41Z",\n        "image": [\n          "logo.jpg"\n        ]\n      }\n    </script>\n    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>\n<!-- ./amp -->\n
Run Code Online (Sandbox Code Playgroud)\n\n

这是我在控制台中遇到的错误:

\n\n
Powered by AMP \xe2\x9a\xa1 HTML \xe2\x80\x93 Version 1524089272632 http://mynewsite.pp/blog/rtger\nviewer-impl.js:1025:11\nError: Layout not supported: container. The element did not specify a layout attribute. Check https://www.ampproject.org/docs/guides/responsive/control_layout and the respective element documentation for details.\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\nlog.js:504:16\nError: Layout not supported: container. The element did not specify a layout attribute. Check https://www.ampproject.org/docs/guides/responsive/control_layout and the respective element documentation for details.\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\nlog.js:504:16\nError: Layout not supported: container. The element did not specify a layout attribute. Check https://www.ampproject.org/docs/guides/responsive/control_layout and the respective element documentation for details.\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\nlog.js:504:16\nError: Layout not supported: container. The element did not specify a layout attribute. Check https://www.ampproject.org/docs/guides/responsive/control_layout and the respective element documentation for details.\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\nlog.js:504:16\nBlocked loading mixed active content \xe2\x80\x9chttp://mynewsite.pp/themes/admin/assets/icon/icofont/fonts/icofont.ttf?v=1.0.0-beta\xe2\x80\x9d[Learn More]\nlounge.bundle.44672f4cc4bed783e5e2f3cb12270277.js:1:1280\nBlocked loading mixed active content \xe2\x80\x9chttp://mynewsite.pp/themes/dup/webfonts/fa-solid-900.woff2\xe2\x80\x9d[Learn More]\nlounge.bundle.44672f4cc4bed783e5e2f3cb12270277.js:1:1280\nBlocked loading mixed active content \xe2\x80\x9chttp://mynewsite.pp/themes/dup/webfonts/fa-brands-400.woff2\xe2\x80\x9d[Learn More]\nlounge.bundle.44672f4cc4bed783e5e2f3cb12270277.js:1:1280\nBlocked loading mixed active content \xe2\x80\x9chttp://mynewsite.pp/themes/dup/fonts/Linearicons-Free.woff2?w118d\xe2\x80\x9d[Learn More]\nlounge.bundle.44672f4cc4bed783e5e2f3cb12270277.js:1:1280\nBlocked loading mixed active content \xe2\x80\x9chttp://mynewsite.pp/themes/dup/webfonts/fa-regular-400.woff2\xe2\x80\x9d[Learn More]\nlounge.bundle.44672f4cc4bed783e5e2f3cb12270277.js:1:1280\nThis site appears to use a scroll-linked positioning effect. This may not work well with asynchronous panning; see https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects for further details and to join the discussion on related tools and features!\nrtger\nUnhandled promise rejection undefined\np13n.min.js:1:41081\n
Run Code Online (Sandbox Code Playgroud)\n

maf*_*tis 5

确保width, height在标签上定义,<amp-img>否则它将无法加载。