I have my page which has a google map in the middle. It works if I load the page thats saved on my on desktop but not if i load from my dropbox for Chrome or IE. It only works in FireFox. Can anyone tell me why?
https://dl.dropbox.com/u/32241044/Blue%20Wolf%20Coding/page.html
Check out the developer console in Chrome and you'll see the following message:
[blocked] The page at https://dl.dropbox.com/u/32241044/Blue%20Wolf%20Coding/page.html ran insecure content from http://maps.googleapis.com/maps/api/js?key=AIzaSyDoXopD-LqdzB0iH92fs09t_YDjyo9rX_4&sensor=true.
This means that Dropbox prevented the Google Maps API from loading. When you're running the page locally, you're accessing it with an HTTP URL, but Dropbox has SSL on it. Change your include of the Google Maps API to include the HTTPS version:
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=true"></script>
You need to use protocol-relative paths like this:
<link rel="stylesheet" href="//example.com/style.css">
<script src="//example.com/script.js"></script>
check this answer:
How to Include CSS and JS files via HTTPS when needed?
Related
I have the exact same problem like Arul.
I am trying to use Google Maps API on my webpage but when I try to implement the map I've got DeletedApiProjectMapError.
First I went to the Error Messages site after I've tried many ways to include the script, like:
<script src="http://maps.googleapis.com/maps/api/js?v=3&key=API_KEY"></script>
//or
<script src="http://maps.googleapis.com/maps/api/js?key=API_KEY"></script>
//or
<script src="http://maps.googleapis.com/maps/api/js"></script>
and tried to add new API key on the Dev site but none of them works.
Is it possible that the error isn't on my side but on Google's?
I have found the solution to the problem.
You need to enable both the Google Maps Javascript API, and the Geocoding API.
https://console.developers.google.com/projectselector/apis/library
and
https://console.developers.google.com/google/maps-apis/apis/geocoding-backend.googleapis.com
Afterwards the error was RefererNotAllowedMapError instead of DeletedApiProjectMapError, but that was because I was running it on localhost - and it worked on the actual site after I added the domain in Credentials -> Domain Verification.
Just to add to the reply above with an image (and this solution worked for me while still staying on the local machine), because I was a bit confused about the enabling of APIs part.
Just navigate to:
https://console.developers.google.com/projectselector/apis/library
Select your project (for which you have an API)
On the right side expand the Maps API section and click on "Google Maps Javascript API" and the "Geocoding API"
On the page that appears you need to click on the "play" button to enable the API
Then you should be good to go without authorizing domains and continue working on the local machine.
Chrome extension breaks HTTPS on all URLS being loaded.
Any suggestions on where to start looking for the cause?
The status of the connection as given by Chrome is:
Your connection to this site is private, but someone on the network might be able to change the look of the page.
screenshot
Disabling the extension resolves HTTPS.
Copy the extention script and place it on your server.
So you can access it without refering to a <script src="http://...>.
But a <script src="/path/to/this/js/on/your/server" ...>.
The problem isn't the extention itself, but it's location.
I have a problem on my SSL website. I tried to add an external JavaScript link to my website. The JavaScript link is http and my website which is https, locks the script link for be http. This is the code of the script in http:
<div class="container radio">
<p>Próximo evento: 29/04/16</p>
<script type="text/javascript" src="http://player.wavestreamer.com/cgi-bin/swf.js?id=1SCZICL137KEA3GK"></script>
<script type="text/javascript" src="http://player.wavestreaming.com/?id=1SCZICL137KEA3GK"></script>
</div>
</div>
Is there any way my site https display the content?
The link of my site is this: https://www.insidecraft.com/radio.html
My second website whose haven´t got SSL works perfectly with is exactly the same code: http://us.insidecraft.com/pruebas2/radio.html
Thanks for your attention.
This is because browsers block active mixed content. You could configure the browser to allow it (at least in firefox). But this only works if you could change the configuration of all browser visiting your site (e.g corporate-network). Only other option is serving the script over HTTPS aswell. As workaround you could also put it in an <script> tag inside the document, served securly. Or copy the script to your HTTPS doamin. MDN on mixed content
If you load the page with your browsers development console opened, it should show an error saying that mixed active content has been blocked.
I've simplified the code to hopefully make it easier to figure out.
HTML
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script src="script.js"></script>
<link rel="stylesheet" type="text/css" media="all"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/smoothness/jquery-ui.css"/>
<div type="text" id="datepicker">
Javascript
$(function() {
$("#datepicker").datepicker();
});
I've uploaded both my HTML and javascript files on my school's hosting space here. When I visit the link on Safari the calendar shows up fine but when I open it on Firefox or Chrome nothing happens.
Any help would be appreciated!
Your schools hosting uses SSL, so it's an https:// link.
When a user visits a page served over HTTP, their connection is open for eavesdropping and man-in-the-middle attacks.
When a user visits a page served over HTTPS, their connection with the web server is authenticated and encrypted with SSL and hence safeguarded from eavesdroppers and man-in-the-middle attacks.
However, if an HTTPS page includes HTTP content, the HTTP portion can be read or modified by attackers, even though the main page is served over HTTPS.
When an HTTPS page has HTTP content, we call that content “mixed”. The webpage that the user is visiting is only partially encrypted, since some of the content is retrieved unencrypted over HTTP.
Chrome and Firefox now has Mixed Content Blockers that blocks certain HTTP requests on HTTPS pages.
For security reasons Firefox and Chrome will block any scripts not loaded from a https adress when the page loading those scripts is using https.
To fix it, simply change the URL's of your scripts from
http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
to
https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
Google supports both.
And use a current version of jQuery, version 1.4 is half a decade old !
I use Google Maps on my project through https, but it will cause this problem above, other browsers will work fine. I have searched it for a long time, but no solution, someone said that this problem caused by using free Google Maps key (according to Google's FAQ).
I am not sure for it.
the main code are as below:
<script id="mapLink1" type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=false®ion=hk&language=<%= MapLanguage %>"></script>
<script id="mapLink2" type="text/javascript" src="http://www.geocodezip.com/scripts/v3_epoly.js"></script>
any idea would be appreciated.
Have you ensured that any marker images are loaded with a HTTPS URL?
Darren