i_Tools: AMP に JavaScript

2018年11月29日木曜日

AMP に JavaScript

先日，AMP に JavaScript を追加する方法がわからなかった．
JavaScript を使用したページで，AMP だと JavaScript の部分がなくなる場合もあるが，
うまく機能しているページもあった．
違いは，直接記述しているものと，iframe を使用しているもの．
html のソースを見ると，<script> は消えているが，<iframe> は <amp-iframe> に．

<head> に，amp-iframe-...js の読込．
<body> は amp-frame を指定．
最初うまく動作していなかったが，sandbox="allow-scripts" がなかったため．

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

<!-- html_end.php -->
    <amp-iframe src='//itl.mydns.jp/f_index.html' 
        sandbox="allow-scripts" width='250px' height='250px'>
    </amp-iframe>