2012-11-25 15 views
22

Tôi đang cố gắng sử dụng một bản đồ google, bao gồm một bản đồ google, tuy nhiên bảng điều khiển đang ném một số lỗi do không khớp, nhưng không có sự không khớp rõ ràng, vì vậy tôi giả sử nó phải là một chức năng/quá trình ở phía bên của bản đồ google.Nhận các giao thức http/https để khớp với <iframe> cho maps.google.com

Cụ thể với maps.google.com, dường như có thay đổi đối với tập lệnh cho iframe, theo this.

Những sai sót trong giao diện điều khiển là thế này: (tôi nhận được ít nhất 30 lỗi trên tải trang)

Unsafe JavaScript attempt to access frame with URL http://www.developer.host.com/ from 
frame with URL https://maps.google.com/maps/msmsa=0&msid= 
212043342089249462794.00048cfeb10fb9d85b995&ie=UTF8&t= 
m&ll=35.234403,-80.822296&spn=0.392595,0.137329&z=10&output=embed. 

The frame requesting access has a protocol of 'https', the frame being 
accessed has a protocol of 'http'. Protocols must match. 

Kể từ khi trang web của tôi là http và KHÔNG https, và url của bản đồ là http, tại sao là không phù hợp xảy ra, và làm thế nào để tôi sửa lỗi này để làm cho chúng phù hợp?

+4

nó không phải là lỗi của bạn đó là một google lỗi http://code.google. com/p/chromium/issues/detail? id = 43173 –

+0

Bạn có thể cho chúng tôi biết mã nhúng chính xác (đánh dấu HTML) không? – Bergi

+0


Xem Charlotte trong một bản đồ lớn hơn

Trả lời

-1

Không thể nói về lỗi mà aSeptik đã đề cập, nhưng nếu bạn muốn tránh vấn đề http/https đơn giản là không viết nó trong URL.

Ví dụ: Thay vì viết 'http://maps.google.com' sẽ dẫn đến cảnh báo bạn nhận được, hãy viết '//maps.google.com', điều này sẽ tự động thực hiện lược đồ phiên hiện tại (http/https) và thực hiện cuộc gọi API .

Hy vọng điều này sẽ hữu ích.

+0

Điều này không giải quyết được vấn đề. Nó cũng không giải quyết được vấn đề để thêm vào cuộc gọi Gmaps với '' http: // ''. – Jpsy

+4

đã cố gắng này và nó đã làm việc - tôi đã không có lỗi. Tôi cũng không có bản đồ ... – Luke

16

Đây thực sự là lỗi của mã HTML có thể nhúng, được tạo bởi trang Google Maps độc lập (maps.google.com -> nhấp vào nút chuỗi liên kết để lấy mã HTML dựa trên iframe).
Như đã nói bởi aSeptik trong các ý kiến ​​cho câu hỏi của bạn, báo cáo lỗi tương ứng can be found here.

Bạn có thể tránh lỗi đó nếu bạn nhúng Bản đồ Google bằng API Maps. Nó không tạo sự khác biệt nếu bạn sử dụng API Maps trực tiếp trong trang của mình hoặc trong iframe được nhúng - cả hai cách đều hoạt động tốt.

Đây là an example của một số bản đồ khác mà tôi đã sử dụng API Maps trong khung nội tuyến.

Và đây là an example của bản đồ của riêng bạn bằng API Maps - được nhúng ngay trong trang.

Các mã bổ sung cần thiết cho API Maps thực sự là rất nhỏ:

<html> 
<head> 
    <script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script> 
    <script type='text/javascript' src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type='text/javascript'> 
     $(function(){ 
      var myOptions = { 
       center: new google.maps.LatLng(35.201867,-80.836029), 
       zoom: 10, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      gMap = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

      var kmlLayer = new google.maps.KmlLayer('https://maps.google.com/maps/ms?ie=UTF8&t=m&authuser=0&msa=0&output=kml&msid=212043342089249462794.00048cfeb10fb9d85b995'); 
      kmlLayer.setMap(gMap); 
     }); 
    </script> 
</head> 
<body> 
    <div id="map_canvas" style="width: 400px; height: 400px;"></div> 
</body> 

Tôi đã sử dụng jQuery đây cho thuận tiện.

1

Thêm thuộc tính crossorigin="anonymous" đến </iframe> giải quyết vấn đề này:

Ví dụ:

<iframe 
 
     crossorigin="anonymous" 
 
     src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d10005.660822865373!2d6.3855055!3d51.1745698!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xbc2d05dc3af26862!2sBORUSSIA-PARK!5e0!3m2!1sen!2suk!4v1448289882279" 
 
     width="400" 
 
     height="300" 
 
     frameborder="0" 
 
     allowfullscreen> 
 
</iframe>

Các vấn đề liên quan