I have been working on implementing user authentication through Auth0. I followed the instructions provided on their website, but I am encountering authentication issues. Whenever I try to authenticate, an error message appears in the console stating that Cross-Origin Resource Sharing is not enabled.
Here is a snippet of my auth.service.ts class:
export class AuthService {
// Setting up Auth0
auth0 = new Auth0({
domain: myConfig.domain,
clientID: myConfig.clientID,
callbackOnLocationHash: true,
callbackURL: myConfig.callbackURL,
});
constructor(private router: Router) {
var result = this.auth0.parseHash(window.location.hash);
if (result && result.idToken) {
localStorage.setItem('id_token', result.idToken);
this.router.navigate(['/dashboard']);
} else if (result && result.error) {
alert('error: ' + result.error);
}
}
public login(username: string, password: string) {
this.auth0.login({
connection: 'Username-Password-Authentication',
responseType: 'token',
email: username,
password: password,
}, function(err: any) { if (err) alert("something went wrong: " + err.message); });
};
}
I believe I need to include a header, such as:
Access-Control-Allow-Origin: *.auth0.com*The error message I am receiving reads as follows:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at . (Reason: CORS header 'Access-Control-Allow-Origin' missing). HTTP status code: 400.
I am currently using the 'lite' Angular2 development server library/process.
The domain name has been added to both the callback and CORS whitelists via the Auth0 dashboard, in the following format:
http://*.[mydomain]*
I plan to add https://*.[mydomain]* to the list and enable automatic redirect to https:// to see if this resolves the issue. However, accessing the website through https results in the following error:
Secure Connection Failed
The connection to www.[mydomain]:3004 was interrupted while the page was loading.
This could possibly be due to the absence of an SSL certificate??