自定義元素內的腳本標記

Question

我正在使用使用Google Map的api的聚合物創建自定義元素。我希望這個元素能夠處理Google Map的腳本標記。

這應該在自定義元素中進行？簡單地把它放在頁面的頂部會引發一個跨域問題。

<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 

<link rel="import" href="../bower_components/polymer/polymer.html"> 

<polymer-element name="google-map" noscript> 
    <template> 
     <div id="stage"></div> 
    </template> 

    <script> 
     Polymer('google-map', { 
      ready: function() { 
       new google.maps.Map(this.$.stage, { 
        zoom: 15, 
        center: new google.maps.LatLng(0, 0), 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        overviewMapControl: false, 
        panControl: false, 
        rotateControl: false, 
        scaleControl: false, 
        streetViewControl: false, 
        draggable: false, 
        maxZoom: 21 
       }); 
      } 
     }); 
    </script> 
</polymer-element> 

Answer 1

FWIW，相信在規範當前分配是<script src...>將進口限制CORS。

你可以看到我們是如何在這裏處理我們的谷歌，地圖元素這個問題：

https://github.com/Polymer/google-map/blob/master/google-map.html

已經有各地推廣這種類型的裝載機制本身到一個組件的一些想法，但沒有人執行然而。