lazy load HTTP script inside HTTPS website

[Jake K.]

Hello,

I am trying to load Baidu map in my website which has HTTPS protocol. However I get the following error:

Mixed Content: The page at 'https://my-website.com' was loaded over HTTPS, but requested an insecure script'http://api.map.baidu.com/api?v=2.0&ak=shT00fgF7SPmpGg75s8gWv90&callback=initialize&_=1435191036739'. This request has been blocked; the content must be served over HTTPS

I tried to load Baidu with HTTPS protocol but it doesn't work.

How can I load Baidu inside a HTTPS website?, or more generally, how can I load a script with HTTP inside a HTTPS website?

Thank you

[Sander Elias]

Hi Jake,

You can't.  Not without the user being warned. It is a pretty big security issue if you do something like that, and actually voiding your HTTPS connection. 

If you really need to use things that  are not provided over HTTPS, switch your app back to HTTP. 

Regards

Sander

[Rob R]

Have you tried //api.map.baidu.com... instead of http://api.map.baidu.com ?

[Jake K.]

Hey, Rob

Yes, I had tried // instead of http:// for the baidu map.

However I found that for baidu map to work in HTTPS a different script should be loaded:

https://sapi.map.baidu.com (instead of http://api.map.baidu.com); notice the 'sapi.api' instead of api.map.

This was in the official Baidu documentation, however I did not explore the documentation too much since it is written in Chinese and the google translations do not always make sense.

Thanks for your support

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/mkN2-nuMSfY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

--

JAKE KWON +1 (604) 655 3109
email: jyk...@gmail.com

• My linkedIn

[Jake K.]

To the Angular team developers,

I have the following issue regarding $http POST request in IE9:

I am trying to make a post request using angularjs $http. The implementation looks something like this:

Assume $scope.user is an object that has been initialized like this:

$scope.user = {};

$scope.user.username = 'my-user-name';

$scope.user.password = 'my-password';

then, when hitting the 'Submit button' this script should execute:

$http({

    method: 'POST',

    url: 'url-to-api',

    headers: {

        'Content-Type':'application/x-www-form-urlencoded',

        'Access-Control-Allow-Origin':'*'

    },

    //-- this section produces the same output as 

    //-- angular.element.param( object ) 

    //transformRequest: function(obj) {

    //    var str = [];

    //    for(var p in obj)

    //        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));

    //    return str.join("&");

    //},

    //data: $scope.user                

    data: angular.element.param($scope.user)

});

--------------------------------------------------------------

The above code works in IE 10 and above. More details of the POST request can be seen in the attached edge.PNG file (the http post request in question is highlighted in yellow).

However in IE 9 it doesn't work. The $http POST request error callback is called right away, as if the request didn't go at all (in fact it is not captured by the IE console window). For more details please checkout the files ie.PNG and ie-error.PNG

PS: the calls are cross-domain, but even if I put the 'withCredentials: true' in the POST request it still doesn't work.

Thanks in advance!!