可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I am trying to load a StageWebView with the Google Maps Javascript API inside a Flex Mobile application as a workaround for the Google Maps API for Flash not working on iOS. I am using the stageWebView.loadString() method. Below is the relevent portion of HTML.Javascript being loaded.

My issue is that everything works perfectly when I view this in a browser (IE, Chrome and Safari) and in the Flash Builder iPhone/iPad simulators. On the actual device the map never loads, and through some try..catch statements I was able to identify that I am getting "TypeError: 'undefined' is not a constructor" errors, which are thrown by each of the lines I listed inside the initialize function below.

Any thoughts on what may be going wrong?

  <!DOCTYPE html>
  <html>
    <head>
      <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
      <style type="text/css">
        html { height: 100% }
        body { height: 100%; margin: 0; padding: 0 }
        #map_canvas { height: 100% }
      </style>
      <script type="text/javascript"
        src="http://maps.googleapis.com/maps/api/js?v=3&key=MY_KEY&sensor=true">
      </script>
      <script type="text/javascript">
        /* a bunch of variables and functions */
        function initialize() {
          var myOptions = { center: new google.maps.LatLng(43.476302, -80.4816062), zoom: 12, mapTypeId: google.maps.MapTypeId.ROADMAP };
          map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
          geocoder = new google.maps.Geocoder();
          dirDisplay = new google.maps.DirectionsRenderer();
          /* some other stuff */
        }
        if(window.addEventListener) window.addEventListener("load", initialize, true); else window.onload = initialize;
      </script>
    </head>
    <body>
      <div id="map_canvas" style="width:100%; height:100%;" ></div>
      <div id="dirPanel" style="width:100%;" ></div>
    </body>
  </html>

Edit: I checked what the google.maps object contained and was surprised to find that unlike the object appearing on browsers, with Map, Polyline, Marker, Geocoder, and a host of other child objects, the version bpresented by the iOS device looks like this:

google.maps {
  modules:Object,
  Load:function (apiLoad) { delete google.maps.Load; apiLoad([/*lots of stuff I don't feel like copying out by hand*/], loadScriptTime); },
  _gjsload_:function (name, text) { modules[name] = text; }
}

Any thoughts as to why it is different? Or what I can do about it to get the Maps API to work?

回答1:

It's definitely suspect whether or not the external script is being loaded. My guess is that either due to connectivity or perhaps permissions, you are not able to download the external script causing an error.

Try testing to see if the google variable is defined before using it

if (typeof google !== 'undefined') {
    // Use google
} else {
    // Warn the user they may not be connected to the internet?
}

If you think you have everything setup correctly, try putting your script on an external location and loading the page from that extenal location i.e. instead of using stageWebView.loadString() try stageWebView.loadURL() just for testing. If it doesn't load you may have denied your application internet access. I'm not sure exactly how this works on iOS but the suggestion is that you are asked about this as and when you try to access the resource - indicated by:

http://help.adobe.com/en_US/flex/mobileapps/WSa8161994b114d624-33657d5912b7ab2d73b-7fe2.html

This may or may not solve your problem but I hope this answer will be helpful for people who have been caught out when using .loadString(). It's easy to forget to check if you actually have internet access when you are already seeing web content, which was actually loaded from a string.