casU2fLoginView.html 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <!DOCTYPE html>
  2. <html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout}">
  3. <head>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
  6. <title th:text="#{cas.mfa.u2f.pagetitle}">U2f Login View</title>
  7. <link href="../../static/css/cas.css" rel="stylesheet" th:remove="tag" />
  8. <script th:src="@{/js/u2f/u2f-api.js}"></script>
  9. <script th:inline="javascript">
  10. /*<![CDATA[*/
  11. var appId = /*[[${u2fAuth.appId}]]*/;
  12. var version = /*[[${u2fAuth.version}]]*/;
  13. var challenge = /*[[${u2fAuth.challenge}]]*/;
  14. var keyHandle = /*[[${u2fAuth.keyHandle}]]*/;
  15. setTimeout(function () {
  16. var registeredKeys = [{version: version, keyHandle: keyHandle}];
  17. u2f.sign(appId, challenge, registeredKeys, function (data) {
  18. var form = document.getElementById('form');
  19. var reg = document.getElementById('tokenResponse');
  20. reg.value = JSON.stringify(data);
  21. form.submit();
  22. });
  23. }, 1000);
  24. /*]]>*/
  25. </script>
  26. </head>
  27. <body>
  28. <main role="main" class="container mt-3 mb-3">
  29. <div layout:fragment="content" id="login">
  30. <div class="alert alert-info">
  31. <h3 th:text="#{cas.mfa.u2f.authentication.device}">Authenticate Device</h3>
  32. <div th:utext="#{cas.mfa.u2f.authentication.message}">
  33. <p><strong>Please touch the flashing U2F device now.</strong></p>
  34. <p> You may be prompted to allow the site permission to access your security keys. After granting
  35. permission, the device will start to blink.</p>
  36. </div>
  37. <form method="POST" id="form" th:object="${credential}" th:action="@{/login}">
  38. <input type="hidden" name="tokenResponse" id="tokenResponse" th:field="*{token}"/>
  39. <input type="hidden" name="_eventId" value="submit"/>
  40. <input type="hidden" name="execution" th:value="${flowExecutionKey}"/>
  41. <input type="hidden" name="geolocation"/>
  42. </form>
  43. </div>
  44. </div>
  45. </main>
  46. </body>
  47. </html>