Getting error with Safari

JWT.io
1

We are getting error with Safari, while we are used the “angular2-jwt and lock 11.7.2”.
Safari shows “ReferenceError: Can’t find variable: Auth0Lock”
I’ve seen a similar post, but no solutions that worked for me.
I hope someone can help me with it.

Thank you

2

:wave: @umeshkolhe.89 the error seems like a common one where it hasn’t been loaded before the script is run. Is this a new application you created ? Can you share your configuration?

3

Greetings of the day…!!!

Thanks for the reply.
Yes we are created a new application.

please refer below configuration :

  1. configuration of variable
    ========================================================================================

interface AuthConfig {
clientID: string;
domain: string;
callbackURL: string;
options: object;
}

export const AUTH_CONFIG: AuthConfig = {
clientID: ‘here we used the clientID’,
domain: ‘here we used the domain’,
callbackURL: CONSTANTS.MAIN.APP.MAIN_URL.BASE_URL,
options: {
autoclose: true,
autofocus: true,
closable: true,
rememberLastLogin: false,
allowForgotPassword: true,
allowSignUp: false,
audience: ‘https://${AUTH_CONFIG.domain}/userinfo’,
auth: {
redirectUrl: CONSTANTS.MAIN.APP.MAIN_URL.BASE_URL + ‘login/’,
responseType: ‘token’
},
theme: {
logo: CONSTANTS.MAIN.APP.MAIN_URL.BASE_URL + ‘assets/resources/logo_small.png’,
primaryColor: ‘#1e2e38’,
},
languageDictionary: {
title: “Sign In”,
loginSubmitLabel: “Sign In”,
forgotPasswordAction: “I forgot my password.”,
forgotPasswordColor: “red”,
error: {
login: {
“lock.invalid_email_password”: “Wrong email or password.”
},
}
},
}
};

  1. Detail of an Implementation
    ========================================================================================

import { AUTH_CONFIG } from ‘./auth0-variables’;
import { tokenNotExpired } from ‘angular2-jwt’;
declare var Auth0Lock: any;

@Injectable()
export class AuthService implements OnInit {
lock = new Auth0Lock(
AUTH_CONFIG.clientID,
AUTH_CONFIG.domain,
AUTH_CONFIG.options
);

constructor(public router: Router, private _http: HttpService, private dataService: DataService, private loaderService: LoaderService,
private logger: Logger, private authUserService: AuthUserService) {
this.lock.on(“authenticated”, function(authResult) {
localStorage.setItem(‘expires_at’, authResult.idTokenPayload.exp);
localStorage.setItem(‘access_token’, authResult.accessToken);
localStorage.setItem(‘id_token’, authResult.idToken);
authUserService.getLoggedUserData();
});
}

public login(): void {
// this.auth0.authorize();
localStorage.clear();
this.lock.show();
}

public logout(): void {
localStorage.removeItem(‘access_token’);
localStorage.removeItem(‘id_token’);
localStorage.removeItem(‘expires_at’);
this.router.navigate([‘/’]);
}

public authenticated(): boolean {
return tokenNotExpired();
}
}

Please let me know the correct implementation.

Thank you

4

Hi @kimcodes ,

Could you please help me for solving the issue.

Above is the code configuration.

Regards,
Umesh

5

:wave: can you try importing Lock into your implementation with something like import Auth0Lock from 'auth0-lock'; or let Auth0Lock = require('auth0-lock').default;

6

Thanks for the reply

Yes we had tried above implementation but getting error as follows:
Error: Unexpected token <
This error display in all browser as well.

please provide concrete solution we are waiting for your reply.

Thanks

7

@umeshkolhe.89 Do you have any Rules or Database Scripts configured for your application?

8

Hi @kimcodes,

We do not configured any rule or Database Script in my application.

We are getting another issue in lock.min.js which we uses version 11.7.2

Please find below console error:
TypeError: ‘undefined’ is not an object (evaluating ‘a.length’)

please provide more detail to solve the issue.

Thanks

9

Hi @kimcodes,

please provide valid input based on that we can change our code base.

Regards,
Umesh

10

Hi @kimcodes,

Can I use lock.js instead of using lock.min.js of version 11.7.2

please provide your suggestion.

Regards
Umesh

11

Hi @kimcodes,

I have successfully login into a safari browser but “Not secure” message on the top left side of url.

This message only comes up in safari browser.

could you please help me to how to secure the application .

Regards,
Umesh

12

:wave: @umeshkolhe.89 I apologize for the delay . Is this the Not secure message you are referring to https://support.apple.com/library/content/dam/edam/applecare/images/en_US/iOS/ios11-iphone8-safari-unencrypted-website-page-not-secure.jpg ? What happens is Safari checks if the website’s certificate is legitimate. When it’s not, Safari displays that not secure warning. You want your site to be encrypted so that it masks the data being exchanges, so that only the user and the application can see it. It prevents anyone from “eavesdropping” on you. Earlier you mentioned it seems you have an angular application that uses embedded login (Lock). I am wondering how you have your application setup to have Safari generate that warning.

Is there any reason you are using embedded login over using universal login?