The server responded with a status of 401 (Unauthorized)


#1

page user.ts

getUsers() {
  this.rest.getUsers()
  .then(data => {
    this.users = data;
    console.log(data)
  }, err =>{
  	this.erreur =  err;
  	   console.log(err);
  });
}

provider rest

getUsers() {
return new Promise(( resolve, reject ) => {
this.http.get( this.apiUrl + ‘/accueil’ ).subscribe( data => {
resolve( data );
console.log( data );
}, err => {
reject( err );
console.log( err );
});
});
}

i have htaccess on my server and we use HTTPS

erreur
Failed to load https://www.aef.info/api/Testapi/accueil: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access. The response had HTTP status code 401.

server.js
.header(“Access-Control-Allow-Origin”, “*”)
.header(“Access-Control-Allow-Methods”, “GET, POST, DELETE, PUT, OPTIONS, HEAD”)


#2

Hi there @nbelghiti. I assume you’re doing ionic serve, ou livereload.

On Ionic serve the easiest way to fix this is to install this plugin on chrome and use it to check your application.

If you’re doing livereaload I think you must configure your api to accept communicating with your device.


#3

i use Ionic Serve
I have already tested this but I have the same error


#4

Please once you’ve served your app, turn the plugin off and then turn it on again, sometimes it gets a little buggy.


#5

I still have the same mistake
in my 2nd server (http) it works well
the only difference between the two is the 1st it is on https and the 2nd just http


#6

Have you checked proxies?


#7

no i didn’t but i don’t think that’s the problem bbut i’ll check the proxies
because it work on the seconde serveur with the same API
like i sad the difference between my two serveur
one with http protocol and the other with https protocol


#8

Try this

<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

#9

where can i add this on my api serve or on my ionic code


#10

Sorry, my bad. In your config.xml inside your app folder.


#11

both of lines already exist in my config.xml
tkx a lot for your help


#12

One last try,

<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />

#13

ISome of my observations…

The error message indicates a cors issue…

If I select the link I am prompted a userid and pwd, which I guess, requires invlusion of login headers in your http request. Which I dont see in your code? Or do you provide credentials differently?

I dont think ionic serve cares about your config.xml

And a nicer way to convert an Observable to a promise is by adding the toPromise() operator. Better: dont convert at all. Subscribe in the calling functiob


#14

Andreven you were right the problem was the proxies
i just change my ionic.config.json
i added this

{ “proxies”: [
{
“path”: “/api”,
“proxyUrl” : “https://www.aef.info
}
]
}

and on my proveder i put this
let apiUrl = ‘http://localhost:8100/api/api/compte’;