progressive-web-apps - OIDC 和 PWA(添加到主屏幕)

标签 progressive-web-apps openid-connect iphone-standalone-web-app oidc-client-js

更新:与 Standalone PWA breaks login 基本相同的问题但在 iOS 上。

如果您将 Web 应用程序添加到主屏幕,Android 上的 Chrome 会与浏览器中的同一域共享本地存储。您可以通过访问 https://wilfrem.github.io/add_to_homescreen_test/ 进行测试。然后添加到主屏幕,并在从主屏幕打开时看到您具有相同的 ID。 (我做了 Nexus 5x)

如果您在 iOS Safari 中执行相同操作,则会获得一个新 ID。 (我做了 iPod iOS 12.1.1)

oidc-client-js 库在本地存储中设置 session 引用,然后在 Web 应用程序上调用该引用
s 登录回调。因此,如果您尝试从 iOS 主屏幕打开的 Web 应用程序登录,它会在 Safari 中打开 OP(oidc 提供程序),然后重定向回 Web 应用程序的 URL,但在 Safari 中不是从主屏幕 Web 应用程序打开的,因此,由于您获得的本地存储不同:

No matching state found in storage



如果本地存储不在同一个域中共享,您应该如何将 oidc 与从主屏幕 Web 应用程序打开的 iOS 一起使用?或者如何让 iOS 在重定向回 Web 应用程序时重新打开正确的窗口(从主屏幕打开的窗口)?或者如何让 iOS 在导航到 OP(oidc 提供程序)时永远不会离开全屏应用程序?

编辑:

这里有一个叙述来解释这个问题。
  • 打开 my.app.com
  • 添加到主屏幕
  • 从主屏幕打开应用
  • 点击登录按钮
  • 登录按钮调用 UserManager.signinRedirect()
  • UserManager.signinRedirect()调用 OidcClient.createSigninRequest()
  • OidcClient.createSigninRequest()将登录状态存储在 localstorage 中并导航到 my.op.com see在安卓上my.op.com在 iOS 上打开 Chrome 标签页 my.op.com打开 Safari
  • 在 op
  • 上完成登录过程
  • op 重定向到 my.app.com/signin-callback.html这是问题

  • 在安卓上 my.app.com/signin-callback.html在从主屏幕打开的应用程序中打开,在 iOS 上它保留在 Safari 中。所以你得到:

    No matching state found in storage



    我没有遇到错误,根据正在发生的错误是完全可以预料的,我只是不知道如何让 Safari 以与库一起工作的方式行事。

    如果相关,这是我的 manifest.json
    {
      "name": "omitted",
      "short_name": "omitted",
      "theme_color": "#omitted",
      "background_color": "#omitted",
      "display": "standalone",
      "scope": "/",
      "start_url": "/",
      "icons": [
        {
          "src": "omitted",
          "sizes": "192x192",
          "type": "image/png"
        },
        {
          "src": "omitted",
          "sizes": "512x512",
          "type": "image/png"
        }
      ]
    }
    

    添加也删除 scope但在行为上没有任何变化。

    更新:
    还尝试将开始设置为完整域,而不仅仅是相对 / ,依旧没有变化。

    最佳答案

    我已经遇到过这个问题,它对我有帮助。
    看看有没有helps !

    关于progressive-web-apps - OIDC 和 PWA(添加到主屏幕),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53948916/

    相关文章:

    webview - 如何在Google Chrome(而不是WebView)中从Google Play打开PWA?

    javascript - 在 PWA 中在线(wifi 打开)时,后台同步代码不会自动工作

    certificate - 使用 OpenId Connect 时验证签名证书

    javascript - 触摸事件不会在输入时触发 iOS8 独立网络应用程序

    ios - 在 iOS webapp 上的启动屏幕和预加载器之间获取 Flash

    ios - iOS 12 上的 PWA 不再与 Safari 共享 Service Worker 缓存?

    javascript - pwa - 提示添加到主屏幕不显示

    ios - iPhone window.open(url, '_blank') 不打开移动 Safari 中的链接

    amazon-web-services - 如何在使用 AWS ALB/Cognito/OIDC IdProvider 进行身份验证后获取临时凭证?

    asp.net-core-2.0 - ASPNET Core OIDC 关联失败