iframe - Options for Google Maps over SSL


Translate

We recently discovered that the Google Maps API does not play nicely with SSL. Fair enough, but what are some options for overcoming this that others have used effectively?

Will the Maps API work over SSL (HTTPS)?

At this time, the Maps API is not available over a secure (SSL) connection. If you are running the Maps API on a secure site, the browser may warn the user about non-secure objects on the screen.

We have considered the following options

  1. Splitting the page so that credit card collection (the requirement for SSL) is not on the same page as the Google Map.
  2. Switching to another map provider, such as Virtual Earth. Rumor has it that they support SSL.
  3. Playing tricks with IFRAMEs. Sounds kludgy.
  4. Proxying the calls to Google. Sounds like a lot of overhead.

Are there other options, or does anyone have insight into the options that we have considered?


Всички отговори
  • Translate

    I'd agree with the previous two answers that in this instance it may be better from a usability perspective to split the two functions into separate screens. You really want your users to be focussed on entering complete and accurate credit card information, and having a map on the same screen may be distracting.

    For the record though, Virtual Earth certainly does fully support SSL. To enable it you simple need to change the script reference from http:// to https:// and append &s=1 to the URL, e.g.

    <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.1" type="text/javascript"></script>
    

    becomes

    <script src="https://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.1&s=1" type="text/javascript"></script>
    

  • Translate

    Just to add to this

    http://googlegeodevelopers.blogspot.com/2011/03/maps-apis-over-ssl-now-available-to-all.html

    Haven't tried migrating my SSL maps (ended up using Bing maps api) back to Google yet but might well be on the cards.


  • Translate

    This seems like a buisness requirements/usability issue - do you have a good reason for putting the map on the credit card page? If so, maybe it's worth working through some technical problems.

    You might try using Mapstraction, so you can switch to a provider that supports SSL, and switch back to Google if they support it in the future.


  • Translate

    I would go with your first solution. This allows the user to focus on entering their credit card details.

    You can then transfer them to another webpage which asks or provides them further information relating to the Google Map.


  • Translate

    If you are a Google Maps API Premier customer, then SSL is supported. We use this and it works well.

    Prior to Google making SSL available, we proxyed all the traffic and this worked acceptably. You lose the advantage of Google's CDN when you use this approach and you may get your IP banned since it will appear that you are generating a lot of traffic.


  • Translate

    If you are getting SECURITY ALERT on IE 9 while displaying Google maps, use

    <script src="https://maps.google.com/maps?file=api&v=2&hl=en&tab=wl&z=6&sensor=true&key=<?php echo $key;?>
    " type="text/javascript"></script>
    

    instead of

    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE"
      type="text/javascript"></script>
    

  • Translate

    I 've just removed the http protocol and it worked!

    From this:

    <script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
    

    To this:

    <script src="//maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>