Auth0 和 javascript Lock v11 的问题答案

【问题标题】：Issue with Auth0 and javascript Lock v11Auth0 和 javascript Lock v11 的问题
【发布时间】：2020-04-23 16:42:15
【问题描述】：

我正在尝试使用 auth0 和 Lock v1 登录表单在我的 Web 应用程序上测试基本身份验证模块。
这是我正在使用的代码的快照：

<script src="https://cdn.auth0.com/js/lock/11.23.1/lock.min.js"></script>
<script type="text/javascript" src="js/auth0variables.js"></script>
<script type="text/javascript" src="js/auth0app.js"></script>
<script>
$( document ).ready(function() {
    console.log("start");
    var lock = new Auth0Lock(AUTH0_CLIENT_ID, AUTH0_DOMAIN, {
        auth: {
            redirectUrl: 'undefined',
            responseType: 'code',
            params: {
                scope: 'openid email' // Learn about scopes: https://auth0.com/docs/scopes
            }
        }
    });
    lock.show();
});
</script>

问题是我无法获得 auth0 模式，因为我收到以下错误：

Uncaught TypeError: Cannot read property 'protocol' of null
    at Object.getOriginFromUrl (auth0.min.esm.js:8)
    at G.run (auth0.min.esm.js:8)
    at $.checkSession (auth0.min.esm.js:8)
    at nt.getSSOData (auth0.min.esm.js:8)
    at t.getSSOData (p2_api.js:190)
    at t.getSSOData (web_api.js:64)
    at t.fetchFn (data.js:4)
    at t.fetch (cache.js:17)
    at t.get (cache.js:13)
    at r (data.js:7)

我不明白我是否在 Auth0 仪表板上以错误的方式配置了我的应用程序，是否缺少一些调用 Auth0Lock 方法的配置参数，或者问题出在其他地方。
有人可以帮我吗？谢谢！

【问题讨论】：

标签： javascript authentication web locking auth0

【解决方案1】：

通过查看托管在 ath0 github repo 上的以下讨论，我找到了一种解决方法：

https://github.com/auth0/lock/issues/1638

为了避免getLocationFromUrl 返回null 值，我在Auth0Lock 构造函数中设置了redirectUrl 选项

<script src="https://cdn.auth0.com/js/lock/11.23.1/lock.min.js"></script>
<script type="text/javascript" src="js/auth0variables.js"></script>
<script type="text/javascript" src="js/auth0app.js"></script>
<script>
$( document ).ready(function() {
    console.log("start");
    var lock = new Auth0Lock(AUTH0_CLIENT_ID, AUTH0_DOMAIN, {
        auth: {
            redirectUrl: 'http://localhost',
            //redirectUrl: 'file://',
            responseType: 'code',
            params: {
                scope: 'openid email' // Learn about scopes: https://auth0.com/docs/scopes
            }
        }
    });
    lock.show();
});
</script>

redirectUrl: 'http://localhost' 或 redirectUrl: 'file://' 选项都适用于我的开发目的。

【讨论】：