UI5开发 – 解决Fiori LaunchPad不能加载Google API问题

在上文中我们已经成功实现了UI5应用加载于Fiori LaunchPad，也确实能够运行，可是由于Google Map API没有加载，导致地图无法显示，在介绍如何解决这个问题之前，我们来理一下UI5在发布到Fiori中需要加载的代码。

---

记得前文曾经提到过，在Fiori中，index文件不会被加载，Fiori中的应用从component-preload开始加载，接下来加载component，然后注册eventbus，加载router等等。就google地图无法显示，因为我们的google api加载于index文件，在单独运行UI5应用中，入口是index，所以没有任何问题。

既然了解了fiori会跳过index，那么只能在component里面解决了，代码如下：

在init中添加一行：

window.onload = this.loadScript(); 

添加loadScript函数：

loadScript : function(){  
 var script=document.createElement('script');  
 script.type='text/javascript';  
 script.src= 'https://maps.googleapis.com/maps/api/js?key=AIzaSyB0Lh5jRLPVVcct3iMVNyS_4NoiUJlvPW4&sensor=false&' + 'callback=initialize';  
 document.body.appendChild(script);   
},  

测试结果：