Niaz Ahsan
Niaz Ahsan

Reputation: 361

Mixed content error in angular 2

I am having a client side built with angular (ssl enabled) and my server is not ssl enabled. I am getting a mixed content error. I searched for solution online but couldn't find anything that can help me to solve it. I am providing necessary information.

Component function :

 onSubmit(form:NgForm) {

       this.subscription = this._validation.validation({
            cell_no: form.value.cell_no, pass: form.value.password,
            username: this._common.getConnData().username, password:this._common.getConnData().password
        })
        .subscribe(res => {
             if(typeof res == 'string') // invalid access attempt
             {
                   this.invalid_access = true;
             }
             else // login successful 
             {    
                console.log(res);     
             }
        })
 }

Service function :

validation(data:{})
{
    const body = JSON.stringify(data);
    const headers = new Headers();      
    headers.append('Content-Type', 'application/json');

    return this._http.post(this._common.getBaseUrl()+"doctor_panel_api/validation_modified/format/json",
    body, {headers: headers})
    .map(res => res.json()); 
 }

I am getting following errors after clicking login button :enter image description here

The whole app works like a charm if I connect server from my localhost. Thanks in advance

Upvotes: 3

Views: 4443

Answers (1)

alexKhymenko
alexKhymenko

Reputation: 5608

It can be due to your client is hosted on https(secure) but making request to http(unsecure). And your client and server hosted on different servers.

Upvotes: 2

Related Questions