免输入登录功能提交

This commit is contained in:
Jerry Yan 2022-08-08 10:25:55 +08:00
parent eff07c4f72
commit 6e4faf0865
5 changed files with 57 additions and 4 deletions

View File

@ -32,9 +32,13 @@ use Webauthn\TokenBinding\IgnoreTokenBindingHandler;
class UserWebAuthnController extends BaseController class UserWebAuthnController extends BaseController
{ {
private $TIMEOUT = 45000;
private $attestationStatementSupportManager = null; private $attestationStatementSupportManager = null;
public function webauthn_login(Request $request)
{
return view("user.webauthn.login");
}
public function register_options(Request $request): PublicKeyCredentialCreationOptions public function register_options(Request $request): PublicKeyCredentialCreationOptions
{ {
$userEntity = new PublicKeyCredentialUserEntity( $userEntity = new PublicKeyCredentialUserEntity(
@ -58,7 +62,6 @@ class UserWebAuthnController extends BaseController
PublicKeyCredentialRequestOptions::USER_VERIFICATION_REQUIREMENT_REQUIRED PublicKeyCredentialRequestOptions::USER_VERIFICATION_REQUIREMENT_REQUIRED
); );
$publicKeyCredentialRequestOptions->allowCredentials([]); $publicKeyCredentialRequestOptions->allowCredentials([]);
$publicKeyCredentialRequestOptions->setTimeout($this->TIMEOUT);
return $publicKeyCredentialRequestOptions; return $publicKeyCredentialRequestOptions;
} }

View File

@ -10,5 +10,25 @@ const webauthn_login = useLogin({
optionsUrl: "/login/webauthn/options", optionsUrl: "/login/webauthn/options",
}) })
window.webauthn_register = webauthn_register window.webauthn_register = webauthn_register;
window.webauthn_login = webauthn_login window.webauthn_login = webauthn_login;
(function() {
const loginForm = window.document.getElementById("webauthn_login_form");
console.log(loginForm)
if (loginForm) {
loginForm.addEventListener("submit", function (e) {
e.preventDefault();
const formData = new FormData(loginForm)
webauthn_login(formData)
.then(() => {
// 成功登录
window.location.href = "/"
})
.catch((err) => {
console.error(err)
alert("登录失败");
})
return false;
})
}
})()

View File

@ -25,6 +25,9 @@
@include("common.form_error") @include("common.form_error")
<div class="block my-2 text-center"> <div class="block my-2 text-center">
<input class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white" type="submit" value="登录"> <input class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white" type="submit" value="登录">
<a class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white" href="{{ url(route("login.webauthn")) }}">
免输入登录<sup class="text-xs bg-yellow-600 text-white">Alpha</sup>
</a>
</div> </div>
</form> </form>
@include("common.footer") @include("common.footer")

View File

@ -0,0 +1,26 @@
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>WebAuthn登录</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
<script src="{{ mix('/js/manifest.js') }}" rel="script"></script>
</head>
<body>
@include("common.header")
<form class="w-full lg:w-1/2 border-2 mx-auto my-2" id="webauthn_login_form" action="javascript:void 0" method="post" enctype="multipart/form-data">
<div class="block text-lg font-bold ml-4 mt-2">登录</div>
@csrf
<label class="block my-2">
用户名
<input class="form-input border-0 border-b-2 w-full" type="text" name="username" value="{{ old("username") }}" placeholder="用户名或邮箱">
</label>
@include("common.form_error")
<div class="block my-2 text-center">
<input class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white" type="submit" value="免输入登录">
</div>
</form>
@include("common.footer")
</body>
<script src="{{ mix('/js/webauthn.js') }}" rel="script"></script>
</html>

View File

@ -26,6 +26,7 @@ Route::post('/upload', ["\\App\\Http\\Controllers\\FileController","upload"]);
// 用户部分 // 用户部分
Route::get('/login', ["\\App\\Http\\Controllers\\UserController", "login_page"])->name("login"); Route::get('/login', ["\\App\\Http\\Controllers\\UserController", "login_page"])->name("login");
Route::post('/login', ["\\App\\Http\\Controllers\\UserController", "authenticate"])->name("login.submit"); Route::post('/login', ["\\App\\Http\\Controllers\\UserController", "authenticate"])->name("login.submit");
Route::get('/login/webauthn/', ["\\App\\Http\\Controllers\\UserWebAuthnController", "webauthn_login"])->name("login.webauthn");
Route::post("/login/webauthn/options", ["\\App\\Http\\Controllers\\UserWebAuthnController", "login_options"])->name("login.webauthn.options"); Route::post("/login/webauthn/options", ["\\App\\Http\\Controllers\\UserWebAuthnController", "login_options"])->name("login.webauthn.options");
Route::post("/login/webauthn/", ["\\App\\Http\\Controllers\\UserWebAuthnController", "login_validate"])->name("login.webauthn.submit"); Route::post("/login/webauthn/", ["\\App\\Http\\Controllers\\UserWebAuthnController", "login_validate"])->name("login.webauthn.submit");
Route::get('/register', ["\\App\\Http\\Controllers\\UserController", "register_page"])->name("register"); Route::get('/register', ["\\App\\Http\\Controllers\\UserController", "register_page"])->name("register");