OAuth2 / JWT / OpenID Connect for mocking auth... which isn't that different from doing it for real, actually.
https://mock.pocketid.app
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
263 lines
6.4 KiB
263 lines
6.4 KiB
<html>
|
|
<head>
|
|
<meta name="google-signin-scope" content="email" />
|
|
<meta
|
|
name="google-signin-client_id"
|
|
content="291138637698-9hjbgadgkibuv9j26104aj0bg5bia30j.apps.googleusercontent.com"
|
|
/>
|
|
|
|
<style>
|
|
@media (prefers-color-scheme: dark) {
|
|
body {
|
|
background-color: #222;
|
|
color: #aaa;
|
|
}
|
|
}
|
|
body {
|
|
background-color: #222;
|
|
color: #aaa;
|
|
}
|
|
.container {
|
|
padding: 2em;
|
|
}
|
|
.authn-container {
|
|
width: 300px;
|
|
margin: auto;
|
|
border: solid 1px #c0c0c0;
|
|
}
|
|
.authn-container hr {
|
|
width: 80%;
|
|
}
|
|
.link {
|
|
background: none;
|
|
border: none;
|
|
padding: 0;
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<pre><code>
|
|
<h1>Tokens for Testing</h1>
|
|
Compatible with
|
|
|
|
* OAuth2
|
|
* OpenID Connect (OIDC)
|
|
* JOSE (Signed Access Tokens)
|
|
* JWT
|
|
* JWK
|
|
* JWS
|
|
|
|
<h1>Resources</h1>
|
|
|
|
* https://mock.pocketid.app/access_token
|
|
* https://mock.pocketid.app/authorization_header
|
|
* https://mock.pocketid.app/inspect_token
|
|
* https://xxx.mock.pocketid.app/.well-known/openid-configuration
|
|
* https://xxx.mock.pocketid.app/.well-known/jwks.json
|
|
* https://mock.pocketid.app/key.jwk.json
|
|
|
|
* POST https://xxx.mock.pocketid.app/api/jwks
|
|
{ "kty":"EC", "crv":"P-256", "x":"xxx", "y":"yyy" }
|
|
|
|
* GET https://xxx.mock.pocketid.app/.well-known/jwks.json
|
|
|
|
<h2>Get a token</h2>
|
|
|
|
Get a verifiable access token
|
|
|
|
https://mock.pocketid.app/access_token
|
|
|
|
For example:
|
|
|
|
TOKEN=$(curl -fL https://mock.pocketid.app/access_token)
|
|
|
|
You can set the expiration (`exp`) with query parameters:
|
|
|
|
* https://mock.pocketid.app/access_token?exp=90d (+90 days)
|
|
* https://mock.pocketid.app/access_token?exp=3h (+3 hours)
|
|
* https://mock.pocketid.app/access_token?exp=15m (+15 minutes)
|
|
* https://mock.pocketid.app/access_token?exp=1565739000 (exactly 2019-08-13 5:30pm)
|
|
|
|
(you can also get the whole header)
|
|
|
|
https://mock.pocketid.app/authorization_header
|
|
|
|
For example:
|
|
|
|
HEADER=$(curl -fL https://mock.pocketid.app/authorization_header)
|
|
# Authorization: Bearer <token>
|
|
|
|
<h3>Inspecting the Token</h3>
|
|
|
|
You can see its decoded form at the `inspect_token` endpoint:
|
|
|
|
curl -fL https://mock.pocketid.app/inspect_token \
|
|
-H "$(curl -fL https://mock.pocketid.app/authorization_header)"
|
|
|
|
<h3>The Token, Decoded</h3>
|
|
|
|
The Token will look like this:
|
|
|
|
<font
|
|
color="red">eyJ0eXAiOiJKV1QiLCJhbGciOiJFUzI1NiIsImtpZCI6IlU1Ym0tQUxtSVFOQ3hfMlFPT1piSm5Ec0d1aEd4WkRnV053alNqck5IbzQifQ</font>.<font
|
|
color="blue">eyJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjQwODAvIiwic3ViIjoiZHVtbXkiLCJleHAiOjE1NjI4NzEyNTh9</font>.<font
|
|
color="green">PWK2eTDQcVCpT_weogKuh4bHInnjqY6TGSnQzwEIc133WnJ1eUmLjq799COxSW7Dr6Khm1Po-CAXGVwCADIBEw</font>
|
|
|
|
The <font color="red">first part</font> is the JWS protected header.
|
|
|
|
Decoded, it looks like this:
|
|
|
|
{"typ":"JWT","alg":"ES256","kid":"U5bm-ALmIQNCx_2QOOZbJnDsGuhGxZDgWNwjSjrNHo4"}
|
|
|
|
The <font color="blue">second part</font> is the JWS payload of JWT claims.
|
|
|
|
Decoded, it looks like this:
|
|
|
|
{"iss":"http://localhost:4080/","sub":"dummy","exp":1562871258}
|
|
|
|
The <font color="green">third part</font> is the signature.
|
|
|
|
It can't be "decoded", per se. It's two positive 32-bit BigInts called <em>R</em> and <em>S</em>, padded with zeros to fill out all the bytes.
|
|
|
|
<h2>Validate the Issuer</h2>
|
|
|
|
The token be signed and verifiable.
|
|
|
|
If the token issuer (iss) is "https://mock.pocketid.app/"
|
|
|
|
* the key url (jwks_uri) will be found at "https://mock.pocketid.app/.well-known/openid-configuration"
|
|
* which will point to "https://mock.pocketid.app/.well-known/jwks.json"
|
|
* where there will be a key whose thumbprint (kid) matches that in the token
|
|
|
|
The public key found there will look like this:
|
|
|
|
{ "crv":"P-256"
|
|
, "x":"ToL2HppsTESXQKvp7ED6NMgV4YnwbMeONexNry3KDNQ"
|
|
, "y":"Tt6Q3rxU37KAinUV9PLMlwosNy1t3Bf2VDg5q955AGc"
|
|
}
|
|
|
|
<h3>Get the Private Key</h3>
|
|
|
|
In truth, there's only one private key right now.
|
|
|
|
https://mock.pocketid.app/key.jwk.json
|
|
|
|
You shouldn't use it for automated testing, because it will change, but it looks like this:
|
|
|
|
{ "crv":"P-256"
|
|
, "x":"ToL2HppsTESXQKvp7ED6NMgV4YnwbMeONexNry3KDNQ"
|
|
, "y":"Tt6Q3rxU37KAinUV9PLMlwosNy1t3Bf2VDg5q955AGc"
|
|
, "d":"GYAwlBHc2mPsj1lp315HbYOmKNJ7esmO3JAkZVn9nJs"
|
|
}
|
|
|
|
</code></pre>
|
|
</div>
|
|
|
|
<div class="authn-flow">
|
|
<div class="authn-container authn-loading">
|
|
<center>⌛</center>
|
|
</div>
|
|
|
|
<div class="authn-container authn-email">
|
|
<center>
|
|
<form class="authn-form">
|
|
<h2>Login</h2>
|
|
<input
|
|
name="username"
|
|
type="email"
|
|
placeholder="email"
|
|
value="coolaj86+noreply@gmail.com"
|
|
/>
|
|
<br />
|
|
<button type="submit">Continue</button>
|
|
</form>
|
|
<hr />
|
|
<div
|
|
class="g-signin2"
|
|
data-scope="email"
|
|
data-onsuccess="onSignIn"
|
|
data-theme="dark"
|
|
></div>
|
|
<br />
|
|
</center>
|
|
</div>
|
|
|
|
<div class="authn-container authn-new-user">
|
|
<center>
|
|
<h2>Choose Password</h2>
|
|
<form class="authn-form">
|
|
<input
|
|
name="password"
|
|
type="password"
|
|
placeholder="password"
|
|
value="secret"
|
|
/><button type="button">Show</button>
|
|
<br />
|
|
<button type="submit">Create Account</button>
|
|
<br />
|
|
Already have an account?
|
|
<button class="link" type="button">
|
|
link existing account
|
|
</button>
|
|
</form>
|
|
</center>
|
|
</div>
|
|
|
|
<div class="authn-container authn-existing">
|
|
<!-- skip this for google auth -->
|
|
<center>
|
|
<h2>Existing User</h2>
|
|
<form class="authn-form">
|
|
<input
|
|
name="password"
|
|
type="password"
|
|
placeholder="password"
|
|
/>
|
|
<br />
|
|
<button type="submit">Continue</button>
|
|
<br />
|
|
<button class="link" type="button">
|
|
forgot password
|
|
</button>
|
|
</form>
|
|
</center>
|
|
</div>
|
|
|
|
<div class="authn-container authn-failed">
|
|
<center>
|
|
<h2>Incorrect Password</h2>
|
|
<form class="authn-form">
|
|
<input
|
|
name="password"
|
|
type="password"
|
|
placeholder="password"
|
|
/>
|
|
<br />
|
|
<button type="submit">Continue</button>
|
|
<br />
|
|
<button class="link" type="button">
|
|
forgot password
|
|
</button>
|
|
</form>
|
|
</center>
|
|
</div>
|
|
|
|
<div class="authn-container authn-new-device">
|
|
<center>
|
|
<h2>New Device</h2>
|
|
<p>Check your email to confirm new device.</p>
|
|
</center>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="./dist/main.js"></script>
|
|
<script
|
|
src="https://apis.google.com/js/platform.js"
|
|
async
|
|
defer
|
|
></script>
|
|
</body>
|
|
</html>
|
|
|