如何将Okta SignIn小部件和SAML SSO与Angularjs SPA集成？

Question

我一直在尝试使用SAML和我的AngularJS SPA（使用Okta登录小部件）实现Okta SSO，但没有成功。

小部件本身可以正常工作（没有SAML集成，只有小部件）。我可以验证用户的凭据，设置会话cookie并重定向到我的应用主页。

我按照此链接（Okta SignIn Widget with SAML）中的说明集成SAML，但没有运气。

小部件能够验证我的用户的凭据，但是当IDP（在这种情况下是Okta网站）使用“App Embed Link”重定向到我的应用程序时，我得到一个空白屏幕，我可以看到应用程序URL的POST将SAML断言作为状态为405的参数（不允许使用方法）。

我真的对此感到迷茫，Okta的文档在这个问题上有点松散。我的一些疑问是：

1. 在Okta管理员中配置我的应用时：我应该把什么放在 “单点登录URL”字段？我的应用登录页面URL？或端点 我的后端负责处理SAML断言的URL？
2. 我应该在哪里放置我的Okta应用程序的X.509证书和IDP登录URL？

Answer 1

虽然可以让SAML与JavaScript单页面应用程序一起使用，但它并不是实现单点登录的理想方式。

我建议使用OpenID Connect为您的AngularJS应用添加SSO功能。这是一个显示how to use Okta's Sign-In Widget with AngularJS的示例项目。

不幸的是，（并且令人困惑）您正在查看的StackOverflow问题是关于如何使用Okta登录小组件登录现有 SAML应用程序。使用Okta登录小组件来支持SAML是不可能的。

如果您 在AngularJS应用中实施SAML，那么您需要为AngularJS应用的后端添加SAML支持。流程看起来像这样：

1. 使用Okta进行身份验证后，您的浏览器会将SAMLResponse发布到您的后端。
2. 您的后端将验证SAMLResponse。
3. 如果SAMLResponse有效，您的后端将与AngularJS应用建立会话。