Skip to content

Instantly share code, notes, and snippets.

@visualjeff

visualjeff/gist:aecae12750463a82b73964643bd094cf

Last active August 1, 2017 22:27
Show Gist options
  • Save visualjeff/aecae12750463a82b73964643bd094cf to your computer and use it in GitHub Desktop.
Save visualjeff/aecae12750463a82b73964643bd094cf to your computer and use it in GitHub Desktop.
Download ZIP
HTML for Charley and Alex
Raw
gistfile1.txt
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>AAD JWT decode and validation utilities</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.1/css/foundation.min.css" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.1/js/foundation.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/motion-ui/1.2.3/motion-ui.min.js" crossorigin="anonymous"></script>
<style type="text/css">
/* Custom styles */
/* Structural Classes */
body {
height:100%;
background-color: #EEEEEE;
}
/*Custom Style for Content*/
#content {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -3rem;
}
/*This is necessary to make the footer stick to the bottom*/
#push {
height: 4rem;
}
/*Custom Style for Footer*/
#footer {
background-color: #EEEEEE;
color: black;
width: 100%;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
/*Custom style for Loading*/
.loading-overlay {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 1005;
background: white url('data:image/gif;base64,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') no-repeat center;
opacity: 0.6;
}
/* Action Classes */
.is-processing {
visibility: visible;
}
select[multiple] {
background-image: none;
}
.hidden {
/* neede to make sprite image ADA compliance */
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}
.costco-logo-160px, .accordion-arrow-down, .house-icon, .house-icon-rollover, .accordion-arrow,.header-arrow-down-rollover,
.header-arrow-down
{ display: inline-block; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKQAAABCCAYAAADZqH3eAAAgAElEQVR4nO2dd3zURfrH37O72bRNb5BASAKhiTSlVwUEVEDRg0PFAmI5UVTkPAt3YNfgKR56oiggYsUCIk2QpjSRXiWQ0BPS26Ztdn5/zO5mN7tJvil45/3yeb3yyrfMPPPsfJ/vzDPPfGa+QkoJgBCChkBK6QMMBK4GrgISgBZAKKCzJbMAuUAacA44AuwHtgkhkhukQBP+0LDbIVLKypO6CzFJKe+UUq6WUpZKD7Dk5svyS1nSkp0rLXkFnpLYcV5KuVhK2bcRf2cT/iCw26GhnpmjgenAvUAggLW4hKJtuync/ivF+49SejKV8vNpyHKLS17hZcAQGY4xNgaf9q3xvbI9pn498E6MjwbuBA4C2xr065rwh4WoS5ctpTQBM4FHAB9ZYSV/zUZyvlhJ/rrNyNKyeisSt+ifBI2+DmCMEGJFvQU14Q8Jux1qbiGllCOA94EWsqycrCVfkfGvhZSdOd8oCnm3jrMfHmoUgU34Q6JWg5RS6oBXgScACtZv5dyTL1GWcrbRlBB6Hd6J8QAlQGot+hiAjkAbIA4IQrkNFsAMpAOngANCiAuNoZ+UshnQCWgLRAEmwFpdeVJKo03Hyw2LEMLjCyyljAU6o+ooAggGymw6XwQuoF7+VCGEtS6FOtVHHBAN+AJ+QD5QhKqPZFSdWKoR4xE1GqSU0g/4ChhhLTJz/smXyP7k27rI1wRjfCzC6AVwzFPlSCkTgLHAKNQo3k+LXCnlOWAV8CmwSWskwdZ99AZuB65DGaKWfKnAStQDf1FTYQ3DFmCQrWwdStc/2f630CgjX0r5E7AWWCGESK2awBZBuR4YA1xbB9lmm+zPgWVCiPzaMlTrQ9qMcS3Qv+z0eU6Ne4DSEyka9agbgm4cQtxHcwE+FkJMtJUPMBqYhqoEpVdpKcWHjlNy7CRl5y5SkZmN1VwMgC7AhFdUOMa4lvh2bu/sBgAcAGYLIb6uTg9bmX8GnkK1LgCUX0in+MBRSo4lY8nMoSK/AAB9gD+GiDC8E+PxvaIdxjjX51Ry5ASW7Nx61kr18OnQBkNYCMAMYB7wF1Q9xdrTlJ5Iwbz/CGWp57BcysRaZAYh0AWa8IoIw6tlNL4dEvFu1xph0Nuz/SSEGOBUH7GoweudqBYWgLLUcxQfPk7pqTNYLmVRkZsHVivC2xt9cCDG2Gh8OiTi26UjOh9ve7ZC4D3geSGEW6XU6EPa3rZvgP4lR05w8uZ7sWRk1afuNMGnXWv74VFb+X2Bt4GuAJaMbHK/WU3eyvUU/bJf8+DJKzqKoFFDCZt4Kz4dEzsDX0kp1wB3CSEuOaeVUnZE+ch9AUpPppK99Fvyvt+g+UX0bt2KwJHXED55AsbYaE6Ne4DyC+ma8tYFHfauBWWQQUAK0AygaMcecj7/jvw1myhPz9AkS+fnS9SMB4icNhlUXBgpZSDwPMrQDbLCSsGGn8j77gcKNvxMedqlGiRWQngbMQ3oReifRxM0+jqTMOgfB+6QUk6pbuDqsYWUUr4K/LUs9RwnRtyB5VKmJgXqi9j5rxDypxsBJgADUBVByfGTpM+ZT96KdW7ho7oi6MYhRL/wV4yxMaCC8iPt/peU8lZgCeBTcvwkaS+/Td53P0A947NCryPysSmkz5nfIJ09wad9G9ptc3Wb8ldvJC3p3xTvO1Ivmc2efpioJ+4HeAw4BnwARFtLSsla+AUZby9q8IvlFdOM6NnTCR470n7pKSHEK/aTaltIKeVg4K/WIjMpt0297MYIqpJteB2Irsgr4OLsN8j6aBlY6+RvV4u8lRso2Lid2H+/TNCNQ1oAa6WU/VD+1nyk5NKbC0h7eR7SUtGgsvShIVjLyhtDbTcEjrzGcVx2+jxnH5lJ4dZdDZLp1EPdALwBkLt8LReefpXyi9paw9pQfj6N0/fOIG/1Rlq+9Rw6X5+XpZRlQoh/OqdzaSFtI9jDQNtzjz9H1qIv6lW4PiiAkFtvwDSoDz4dWqMPCaYiN5/Sk6kUbNxG7rLvsWTmqMQ6HZ3P/4LwVr6Gefd+Tk96grJzF+v942uETker918j+OYRAL8BbWSFVXf2oafJ+WJloxQRt2Qu6UnvUnzgaKPIc0biuqX4Xd2F3OVrOTt1pvING4h225c7jNJaXMK5R2eR82Xj1IUnmAb2IuGLdxFGLyswQAixzWGHVQzyPmC++dcDnBh2W91L0umInDaZqMenoPOvfiBsNReT8fZiLs39AK9mEbTfvQpQXU/qpOkNCrBrgfD2pu2Pn+HTIRGA8397mcz3ljaK7KDR1xHz0pMc6TSkUeQ5wxARxhVHN5Lx7hIuPJvUKDKFXseVF/YgvAxYMnM4Ne7+enf9dUHEgxOJfvFJUIPNLvbruirppgNcnP1GnQvQ+XiT8OW7NJ85DZ2/nxX4BBWmiQL0QHNUl/Cxzs/XGjXjARLXf2qfnSH/hy2k3v3YZTdGUCP180+/CkDhlp2ajVFn8se/d3f8e3bF2CrG7b4hLIQWc2aSt3pjo+prR+DwQWQt+rLRjBFsITcvA9YiMydvnvy7GCNAxvyllBxLBhXNuM5+3eFD2ka2bUuOJVP40y91LqDl2y8ScE1fUE7xeCHEgSpJ0lAxwVVSytnAEp/2bXo3//ujlJ48zenJMxo8cKkLCjfvoOT4SdJefUdTetOg3sQvmYvO5O+4Vn4hndzl68h8fyllqeeImfMshvAQ8tduviw6G1u14PyT9Qxv6nQe/XGftgkAnPnLM5Qc/q0h6tUNVitZH3xGTNKzAOOBdeA6qLkBIGfZ93WWbep3td0nSwOuEUKk1ZReCJEspRwGZCGl8ezDM7EWFmkuz6/bFYSMH41vl47oTf5YsnIo2LyDrA8+pSK/ULOc3G9WU7T9V01phU6HJSMbo5NBekVHEfHgRMLvnUD+D1sIul6FS4NHDSX4puHo/HwRXgb0QYGYf9nHxefnaiqrxRv/wLt1HNaCQmR5ORWFZiryCsj490fICm2DPKHXETz2ekImjMGv+5XoA01Yi0sw79pHzleryPl8BbLcgne71uR+vVpFFTRCHxxI6IQxmAb2xtgyGmtpKSVHTpC16EvMv1Zth6pH/vqt2PqZ/vZrzgY5EKBw0w7NAu0IummE/fDF2ozRCXcCxrxVP1K0Y4+mDDofb1q8MYuQ8aPc7pkG9iLs7j+RfP2dlJ/XpoJ590GNqkLBxm0cvWokhrAQfDu1x7dLB/x6dsXUvyf6QJPDGAFCJ97ilj/v+/WaytEHBxJ6+1jnYDUAaa++Q7nGgZ6xVQxxi9/Et3MH+yULkKvz9Qk2DeptMA3qTeS0SZx58Bm842O5+NybmuQCBI0aRss3Z6EPCXK57tetE6G33cT5J18ic8GnmmSVnT6PLC1FeHsn2K85+5DtAUqOntCsnB1eURH2w7oQI+4CyJz/sbbUQhD30Zt2Y8xEzVJcCcQAfYA1xpbRRD/3hGYFrLYZl7pAtcbbufTWh6Te8QiH2w4g9a7HKD54zDnZu8DNwBDUDAX5q7T5lYFDB9iNcRUwHLDK0jLNfq4hIow2339kN8YDNj0ChBARgD8wEtjm3TqONisXIfQ6zQSZoBuGELfwdbsxfgYMQ9V/IjAdISzRLz7pbA+1wlpSBk4No7NBhlfkFWAtLtEszI6S4yfthxNrSyuljJNSfg70tFzK1OyvhowfRcDQAaDIF12EEHOEEIeEEBeEEDtQc7iY+vfQrLdXbAvlWzUAsqycvO9+4LdrxpExb5H98jjgJxQ73lRy+DfKzmrjeQRWtrRLUXP2uoIff6YiJ09T/uazHscrOgpgBdBDCPGtEKIEQAhRJoRYA/QDtgijF3lrNmmSq/PxJmbOs/b6miyEmCCEWG+r/2RbPPEz4WXAv3d3TTJBzeagiCqqHM05a0DWAofvNklK+aWUsrszC11KGS6lHCul/Ao4AYyzZOWQ/al2okbIOEc3/XA1LB4/AGtJqWaZPh3aEH7POM3pa4TVyoW/zyH369Wglm1MR5ERND90YdATcG0/UA9oDarlp2CLdjcqePQwUKyee4QQHkMWtlm5OICiHdp8aNPgPvaWb50Q4sPqkgFYi4s1yfSKirDPdafarzkbZKHOz7deLUZ5egYpEx6yz3ffCvwKFEkpT0spC4AMFGtobEVBoSHj7UUc63EDJb9pJ2vYpvygejb5TIDCTds1y/Tv1Y3oF58kdMIYzXlqw6W5H9gPR9v+yF/1o6a8pn7KH0WRHLJR65IoPXZKU37h7Y3O1wcUxaza0Z2UcjQQW5FXgCUjW5NsJ+KIx7dDStkJuNFaUqp5TODXs6ubTGfrSxZeBrwTYqkPirb/yrHeo0l7eR7mvYeR5RY/IBYpTeXn08j9ejVnH57JkY7XcmHmHCryC9H5+WqWX3b6nP3wXhv5A1DcPCnlfGCqtchM+hvva5JniAjFv1c3hNGLlm+/SOsVCwkcMdgxY1RfFB/+DammDdsDXcvTMzDvO6wpb+CIwfbD5bb/oQCWLG1GI0sdxhAMLLGxddQ9KUOllOOklFvt8uvCRCo77fAzR0spw53kGqSUfwY2AoaMtz7UHOmwteagWGWA6yh7G9A1YHAfSpNTNSvqjIqcPNKT3iU96V1ABZKt5mKP8S/fzu3RBwZoln3pzQWYBvZG6HWvAtOllMlAOIqoq7MWFpF656OUpZ6rWZANYXfeqgLChUXoTP6Y+vfA1L8H1uISRTU7/BulJ1MpOX4K8+792sNJVqu9l9EBKiapkaQROHKw/dDOhDEDdXpxzz42mzYrF2GICBsHjJNSZtp0CbWnKT+fxoV/vO4xWlEdCtZvpXj/EXy7dOwKXJRSHkK5Bu2xravK/uRb0l77tyZ5hshwgm4cAuo3Opg/zi3kcoDQ22/WrGRtsBYWVUuO8O/dvU6tceHWXZy6ZQrmPQdBykgUTaytJTtXl7XwC471Hk2Bxu7aEBpMxNR7kJYKkkffw+l7Zzi6Lp2vD/69uhE2aTzRLz5JwrL5dDyyEUNEmCbZxlYxLiGbfI2zNj5XtLW7JceclgSfAexsek0oPZHC8f5jyXz3Y3urFi4rrKHlFy+R++1aTt87g6PdhpO/6kcCBvWxd/G1QpZbOHnTZLI+Woa1yGxAUQN7SktFYOHPu0m94xHOTn1WMxkm6on77b3RAmd+pHMLuR5I9u3SsU3QjUPIW7lBWw3UE6be3fHtfmWd8hRu2cmJoRPQBwVgCA/DajbXi40S89oz6IMCSHv1HYr3HaF43xHy12wibNJ4QsePxucKV4J44ZadVGTnaJIdOGyg49haUkqBxrhuUGV37cwT3An8xTSgF9lLv9EkB8CSkcX5p1/h/NOvIPQ6j8F0vx5dEUYvTIN6k69x0FWRV8C5R2dxfvpzeMU0Rxj0lJ1PR5ZqH0gC+Pe9mvBJ4wGyqcKsdxikEMIqpXwK+DLmtWco2r4HS5a2h1Af+PfujiEynIChAyhYv7VOeSvyCqjIq3sMESDiobsJHjuS4oPHuPR6JV/Rai4mY94iMuYtwhARijG2BTqTH6XJqZoD7cLLQPj9dzjOC378WfPDcqKVLXe6vAqwBN04xGAIDa4X+7y6mR3/Xt0ACLvrT5oN0llmfRf3ecU0I27h63a3ZnpVorTLkFoIsQz41qtZJHFL/+VMP29UeCfEYohUfnH0c9Pt62kuO8In/5no5xSb6MyDT1XLe7RkZGP+9QCFm3doNkaAqBkP4t26leNc64M2RIbj1/UKUAF/R5MqhMgEPtH5+RL11FTNemiB3SADhw+ycxAuO4wtmtN6+Yd292eREGJR1TSeYjz3AEf8e3Yl4dsPMESEekjSMDgHTn3at6HFG7MavQxnCIOe6Bf/qibyhSAt6d+UHKn7jFRNCL1jLFHT7wPl6IPVqplkETh8kL3FWOVhkdtMwBw+aTxBo4a5Z64n/Ho4GF/EvvsKxviWjSbbE/z7Xk3ihs/s44YS4BlP6dwM0uZgDgMO+ffsSrutX9tHQ42nXKVBvgBkhk4YQ6v3X9PsYNcFft06kbj+MyIevBMA868HyKiMFTYYwqCn+bPTaDl3Nihjeg/AvOeg5nVIQZXdtZujKIQ4A0xBCEUsHjO8wTp7J8ZjCA0GNdX7iSEilDbfLcKvW6cGy64Kncmf6OefoMWcmeT/sNW+fNoHGzPdLb2ni7aZkD7AMkNkOHEfzaXN94vV1F0DN6UCF4NciJqvvRR8y/W03bLMZVDQEPh26UirD+aQuP5TZ5IBhZt3InwawfCFIPC6gbTdtIzIx6eAEGbU9GUJQN7qTZrE6Hy8MQ3uA6pl9cjAEEJ8AkwTRi9afTiHmKRn7QH0esG/MiC9DdUjLvOKjqLN6iWKz+rEaKov9IEmIqdNpsOvq/Bp15q0l96iaOdeLsx+wz4Sv9FTvlq3UrEtgErCNtVUfiGdvNUbKdyyg+K9h2tdaqAPCsAY1xJjqxb4de2If78e+KvuIk0I0dxWRjPU2unBAMX7j5C15CvyVm6o05oe78R4AocPImTs9fh2dazTT0ORhUejYpZYzcXkfb+Bwk3bKdiys05+ondiPEEjBhM68Ra828TZL+9ATdUdk1IeB9oe73ezJqJK4MhriF/6L4A1QoiRNaWVUo4FFgOmitx8shZ+TvYnyyk9mapZf0NYCC3enEXQDUMAJgohPrbZwOPAy4CxIr+QnE++Jefr1SrMpjGUow8KwDSwN0E3DiHoxqGOHi/tlbcRQlCekYXQ6Yh55SnQ6S4JIaKcfhugcW8f204MfwYeRC2gr7xXWkrZuYtYzSWOILPQ69GHBmEICbZPnldFPvCqEOKlKgrdilp+2d5+vTQ5leKDxyhLOUv5xXTHGmx0OgzhoXg1j8S7bQK+ndpjCA9xLiMZtaz1HSFEoW1253rgftt/R+9QfiGd0hMplCSnqjIKzVgLCkGvRx9gwtAsAp92rfHt1M5OXLBjD+pl/cIWpWgLHEdKCn/eXW19OsMYG22PPz4ohHi3tvS2lzcJuM3+G8pSzlK0e79aJ52WgSxTbqzOzxd9aDCGiDCMsTF4t26lfLjKZ91aCHHKSXYcKgwzDlsEpiKvAPO+Q5QeO0X5xXQsmdmOQL/O5I9XswiMcS3x6dBGkX0rp55LUBsZXGfJzCH7468Q3kaCbxqBV/NIgDlCiBlOZQNOBonaycyxSLwGxKGC0vXaOQ219ncPTgwPDxhoK6e+SMZ9ztts+wtHzVoMRfky9cUh1O9wRgJOZNM6YiUqLlcVv6JYQ1Ud+VhsPUo9sA611HUfngcXzVDLCiwoo68rwcGMIocUohqyqq2SFbjZeW22J4NcjCLNNuH3wy6gZy1p5qC2jxnciOUWAguA7tiI2dXADHwI1BZzeg74ex11GOPJIN1auczcUp54o+5rav4bMPmmRLYfyGDbAdfZm/ee6UtkqGoMX1hwgN1HK/3Shf/oT0igeoFnv7efvccrR8YlJRUIncDbWNlAPDGxE/27RgJwz6yfySmoDHwP6xXNQ+OUt1FSVsGKzWfZsOsih0/mUmAux8eop3XLAIb3iWHcsDh8vfU9Ab7ZeIbFK103EH71kato1yoIVAt536XsEu57seZtMyde35pbhrTCapWs3X6Bbzae4WByDkXFFny89XRqHczoQS0ZPbClSacTjwIcTcnjqXnuFLSkaVeTGBvoh3INeOCl7aRlVdLKWjUzMXdGT1AbS6UDLPn+JF/9eLpGHZc8P4AAPy9w710ADwZZaC5n8cqTntL+1yPQZKR5uC/LN7nuzDb7fjORoT4kny1g1vx9VFgryQ4XHzITEmgk+WwBz7+/3+XekB7N2bDjQhVZaoSanV/Kou9cjWhgt2YAvP/Nbzz7zl4uZbuTnXcdzuTTNSnMfGcvn78yiD6dI/huy1k3nRfNcvT8uUDg7qOZbmmq4u5RbThyKpfbn93KvuPuvf8vhzNZuvoUBz8fQ9tWgQA89MoONu52H9SN6BNDYmwgQGhxaQULvjnhUjfjhsXZD/ehtvBm2YbTrNhcvY6RoT52Y8wWQnhkwTQKQfe/Bdv2X6Jfl0i367kFaheJFxa4GhzgeOuTPjrkci8syJvObV0GSRi9dHRMUHsueXrgXdoGc9c/fuK+F7Z7NEZnnE0vYsTUHziTVsTeKrLiok0EBxhBdZkmgL3HaqegNQvzZdCUNR51s+PvU7o4jPGTNac8GiPAlr2VW6ccTM5xq7du7R0TJnux7cFUm47d2jnyVEuYdGshm4X7svG9hgdf/xMw6HVc1SEML4OOckvlmCm3oIzkswV8vMqd6JqRU8q5dDMLV7i2dkmPXs2X61NdriXEBHD+ktopYtNu971uftiZxkdVeheDXtCzUwQGvWDr3nQXJlp+UTn/+uwoh5JdOQNOD86xiH7fb+4Pe907w/AyVLYpi1eeJDPXde5843vDaR8XxNa96azYfJa/3tXJUfb0f7pGAvQ64TC8rU4G6cnQurZ10XFmdn4pZ9NdV46O6BvDk3dXBtubhztodPvcBNrgocu2sKjKw/kjwd+3I93bh7LzUKWfmFtYxssLD7q95QCZuSW8/vFhFwPu3zWSu0e14el5ri/ysdQ84kd95bHcFlH+zP3EdZF9XLSJtfOGOVqkbzaeYewTrnS0n/dfwlLhqlfXSoPch631qdrq6XSCGW9W+n6z7u/CzoPuO54Ne3AdV7YJ4doezXl6UmeHAT/7zl4Xn7BjQjDhwd5s2aMM8Vy6mdQLhcRFm1z8ajucWsgywOjJaH89msWjc9R4xMsg2LH4BvutvW6Jbfif8iEBEloE0K9rpItB/nY6j49XVf6mzokhHDihWqVT5wv44NvKALZBL3j36T6kZxe7PLDaEBniw7kqLcSs+7s6jBFgYPeoqtmwWNxfEqcWshnQu8BcTvJZV3aT1SrZ79RqNg/3Y9BVzdy6f0uFZO/xbPYez+atz47ywzvXEWjy4p0vXFZJ8tjtHflqg+uA5Kd9l4iLNrm9DM3CfIkK9QUVFhoPuJULkJFTQkaOcl26tA1FrxOg9lOqdg/5/ykfEuDnfe5+5IfLkykrVy1g6xYBDOsV7bj36ZoUCsyVO5U9fscVXNE6uEY/zBOCA9wZSwF+ru/7J6vdXQaTn3s4t1s7Bxn4JiC8Nl10OkHnxBCSHr2apEevpscV4Rj07hMd5RYrC1ec4C8v73DpLaJCfZl4fYJzlwqobrvCKh0vr0O/ytbRANwNdfIf22Dziz3BrTZaRPmT8p37Qvc/Cgx6HV5erg/DuaV7YuIVZOVV+lkXMyvvxTbz5+9TFAum6hsvBKx9W/lsB0/k8EiS6xZ4HeKD+fEX1wHCw6/t4vwlMxEhPvz4SxofLHedSoyO8KO03HV+QK8TLPi2ckuThJgAcgvdFw+uemsoI/u57i/08Gs76d4+jJ8/VDOQC75VxudaFyXsqNK1Z+WVEDXsC4pLXbey2bInneOpeRSXutL0snJLmTW/0g28dWicm4/bMsqfM6tuddMbNcKudq7WzSAvZRdz0/TLs1nS74WlLwygTcsAt26uZZQ/k8Yk8v43nveweWtGL/x9VZVUfePbtAx0tKy/nXbfKnvK2EQWr0ym0Fz5UC9kmN0M1w5fbz2fvzKI6x925VNUWCWz39vvOL9vbFsX/9aO6x9xzffes32Y97nqhqcl7SIu2sSJM656Gr107Dzk7mdaKiR5Hoz+WGoem/e4D952Hc5k1+FKl2h4n2iOpbquGz+bXoS4arHjfGS/GFa9NRRqGNCAB4MsK7e6+CZ/RGzek07fLpFuBvn0pCsxeunsIRUXjB7UkjGDKzmBVR15py7HrfUMC/KmS2Ion708iPF/20xRcc2bZnVMCObjF1SA2Nld8IRu7UKZ/3XNm0CFBBiZ+U7lcy4wl3Owysg9wM+LPp0jWFclrnr7yARH934kJY9fDruSWdZur3mDA4NeUGFVPm1tv8OGGtfIuhmkTicIMnkkRPxhsO94NoOvauYSSG4e7sukMWo/yPBgH5ff6GPU89aMyhm8omILWXmlLml6darcHuTk2QKXe31tPusN/Vtw6Isx/HPpEVb9dI6T5ypfiPBgb/p2ieS2EQncMqQVBr3guy1na63rLm1DOZdeVGO6XldGcM3VzVj18zn2Hssmv0gZuRDQNjaIMYNbcm2P5kx4erOLnKG9mvPxC5X0hS/XpzLledeFcsdScmss+4rWwZw8V1Dr77i6o2PlbLUjbGiay66KQmpwuDUgDdsG9KCmDwuKyvHzMThcgd8DeYVllJZZCTR54WPU155BkS2uqzVV46CDEOJY1Yue5rIzsS27/B+GleojCxbgaxT1qr4Yj2K23AX09jHq2/gY9UZbuedQ/tP3QGsUC6axkQZEBpmM0TY9CvHMIHJGLnAL6qu8l/utKUGFfaqFcwvZhCb8x/E/F4dswh8bjiY6ISHhZeBv9ZDxyqlTp56CGljn0+Y9gFrU8xhzp3pkRdfKXE9aWyljxvCaZTz69gfApBp0/lC++dBkADFnXe1pn7hucg33m9CIcLSQKSkpT6E2Aa0LZtjyVY9p825DfZUrFXjbdl43JK11laHOa8IUqp+eWmG7X+e0CQkJCxMSEgxCCDz9NaHhcOmyU1JS5qAeQG2reqzAFFv66jFt3k2oL2R9iNrt9kNgie26NiSt9SxDXfeMuVOtqK+CVWW0bgMm2O4rzBhec1p13467ge/j4+MDacJlgZsPmZKSsgD1gKqL7lqACbZ01WPavBHAl6itf5NQ+9Qk2c6/tN2vGUlra5ah7nvG3Klm1GdJ7CGGY8Ao23VXzBjuOa26XhXXAVvj4+OjPdxrQgPhcVCTkpLyBeoBVWWZlgCjbPerx7R516IWva8B/oHaO7C77f9M2/VvbOk8I2mtNhkqnWfMnZqN2vRgFzDMdu4ZM4a7plXn1aEzsDM+Pr7xV9b/P0eNy2Dj4+P7AqtR+//lAyNTUth+yDEAAAGZSURBVFLcFna4yJg2ryewAfVgJ9uOE5ySn0KtoPsAtcBpCHOn7nKRkbS27jJmDN91uUNYCQkJVQvIB25JSUlZD5X10IT6o8awj834BqC6sAGejNEF0+Z1Bn5AsYjvQRlzQpVUCbbr99jS/WDLp5C0tn4yVL7fG4HA6vj4+P/vM1yNBucveVWX5gDQobqbVbAaFYm/HTUj0b6adO1t929A7T2+Guzf0GkUGb8nDMDi+Pj4ONRy0CY0AI09VXQ/anS6FqjNv+qEMqTh2D6a3ogy/hPQNGnchJrRqFOHNh8yGKi60+l0FO2oO+qb2M4IYe7U3Co+ZN1lzBie+x/wIUFFHaakpKQsavIhG47fg4JSyNyp9o90b2LavNnUnVFTyIzhlTKS1tZHxuVAPvCnlJSUdf9pRf5X8HsYZNUgu7attBpfRmPjAirqoP1rk02oFU3kivrhANCryRgbH5fDILVw8OzIxvMXpxpDxuXCelQITNsHcZpQJzTxIeuAhISEhcD9KSkpHr8h2FSXDUeTQTbhvwpNPmQT/qvwf+KqcJqGq8FxAAAAAElFTkSuQmCC') no-repeat; overflow: hidden; text-indent: -9999px; text-align: left; }
.costco-logo-160px { background-position: -2px -0px; width: 160px; height: 47px; }
.accordion-arrow-down { background-position: -2px -49px; width: 15px; height: 8px; margin-right:0.5rem; }
.house-icon { background-position: -36px -49px; width: 15px; height: 14px; margin-right:0.25rem;}
.house-icon-rollover, a.house-icon:hover { background-position: -19px -49px; width: 15px; height: 14px;margin-right:0.25rem;}
.header-arrow-down-rollover, .header-arrow-down:hover { background-position: -53px -49px; width: 9px; height: 5px;margin-left:0.5rem;margin-bottom:0.225rem;}
.header-arrow-down { background-position: -64px -49px; width: 9px; height: 5px;margin-left:0.5rem; margin-bottom:0.225rem;}
.accordion-arrow { background-position: -75px -49px; width: 8px; height: 15px; margin-right:0.5rem;}
.slide-in-down.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-left.mui-enter,.slide-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden}.slide-in-down.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-left.mui-enter{-webkit-transform:translateX(-100%);transform:translateX(-100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-left.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-in-up.mui-enter{-webkit-transform:translateY(100%);transform:translateY(100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-right.mui-enter,.slide-out-down.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden}.slide-in-up.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-right.mui-enter{-webkit-transform:translateX(100%);transform:translateX(100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-right.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-out-down.mui-leave{-webkit-transform:translateY(0);transform:translateY(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-right.mui-leave,.slide-out-up.mui-leave{transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden;transition-duration:.5s;transition-timing-function:linear}.slide-out-down.mui-leave.mui-leave-active{-webkit-transform:translateY(100%);transform:translateY(100%)}.slide-out-right.mui-leave{-webkit-transform:translateX(0);transform:translateX(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-right.mui-leave.mui-leave-active{-webkit-transform:translateX(100%);transform:translateX(100%)}.slide-out-up.mui-leave{-webkit-transform:translateY(0);transform:translateY(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-up.mui-leave.mui-leave-active{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.slide-out-left.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(0);transform:translateX(0);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.fade-in.mui-enter,.fade-out.mui-leave{transition-property:opacity;transition-duration:.5s;transition-timing-function:linear}.slide-out-left.mui-leave.mui-leave-active{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.fade-in.mui-enter{opacity:0}.fade-in.mui-enter.mui-enter-active,.fade-out.mui-leave{opacity:1}.fade-out.mui-leave.mui-leave-active{opacity:0}.hinge-in-from-top.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:top;transform-origin:top;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-bottom.mui-enter,.hinge-in-from-right.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-top.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-right.mui-enter{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:right;transform-origin:right;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-right.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-bottom.mui-enter{-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-left.mui-enter,.hinge-in-from-middle-x.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-bottom.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-left.mui-enter{-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);-webkit-transform-origin:left;transform-origin:left;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-left.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-middle-x.mui-enter{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-middle-y.mui-enter,.hinge-out-from-top.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-middle-x.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-middle-y.mui-enter{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-middle-y.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-out-from-top.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:top;transform-origin:top;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-bottom.mui-leave,.hinge-out-from-right.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-top.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-right.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:right;transform-origin:right;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-right.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.hinge-out-from-bottom.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-left.mui-leave,.hinge-out-from-middle-x.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-bottom.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);opacity:0}.hinge-out-from-left.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:left;transform-origin:left;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-left.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);opacity:0}.hinge-out-from-middle-x.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-middle-y.mui-leave,.scale-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-middle-x.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-middle-y.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-middle-y.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.scale-in-up.mui-enter{-webkit-transform:scale(.5);transform:scale(.5);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.scale-in-down.mui-enter,.scale-out-up.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.scale-in-up.mui-enter.mui-enter-active{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-in-down.mui-enter{-webkit-transform:scale(1.5);transform:scale(1.5);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.scale-in-down.mui-enter.mui-enter-active{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-out-up.mui-leave{-webkit-transform:scale(1);transform:scale(1);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.scale-out-down.mui-leave,.spin-in.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.scale-out-up.mui-leave.mui-leave-active{-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}.scale-out-down.mui-leave{-webkit-transform:scale(1);transform:scale(1);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.scale-out-down.mui-leave.mui-leave-active{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}.spin-in.mui-enter{-webkit-transform:rotate(-.75turn);transform:rotate(-.75turn);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.spin-in-ccw.mui-enter,.spin-out.mui-leave{transition-property:opacity,-webkit-transform;transition-duration:.5s;transition-timing-function:linear}.spin-in.mui-enter.mui-enter-active{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out.mui-leave{-webkit-transform:rotate(0);transform:rotate(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.spin-out.mui-leave.mui-leave-active{-webkit-transform:rotate(.75turn);transform:rotate(.75turn);opacity:0}.spin-in-ccw.mui-enter{-webkit-transform:rotate(.75turn);transform:rotate(.75turn);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.spin-in-ccw.mui-enter.mui-enter-active{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out-ccw.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:rotate(0);transform:rotate(0);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.spin-out-ccw.mui-leave.mui-leave-active{-webkit-transform:rotate(-.75turn);transform:rotate(-.75turn);opacity:0}.slow{transition-duration:750ms!important}.linear{transition-timing-function:linear!important;-webkit-animation-timing-function:linear!important;animation-timing-function:linear!important}.ease{transition-timing-function:ease!important;-webkit-animation-timing-function:ease!important;animation-timing-function:ease!important}.ease-in{transition-timing-function:ease-in!important;-webkit-animation-timing-function:ease-in!important;animation-timing-function:ease-in!important}.ease-out{transition-timing-function:ease-out!important;-webkit-animation-timing-function:ease-out!important;animation-timing-function:ease-out!important}.ease-in-out{transition-timing-function:ease-in-out!important;-webkit-animation-timing-function:ease-in-out!important;animation-timing-function:ease-in-out!important}.bounce-in{transition-timing-function:cubic-bezier(.485,.155,.24,1.245)!important;-webkit-animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important;animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important}.bounce-out{transition-timing-function:cubic-bezier(.485,.155,.515,.845)!important;-webkit-animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important;animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important}.bounce-in-out{transition-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important;-webkit-animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important;animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important}.short-delay{transition-delay:.3s!important;-webkit-animation-delay:.3s!important;animation-delay:.3s!important}.long-delay{transition-delay:.7s!important;-webkit-animation-delay:.7s!important;animation-delay:.7s!important}.shake{-webkit-animation-name:shake-7;animation-name:shake-7}@-webkit-keyframes shake-7{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}15%,25%,35%,45%,5%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}@keyframes shake-7{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}15%,25%,35%,45%,5%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}.spin-cw{-webkit-animation-name:spin-cw-1turn;animation-name:spin-cw-1turn}@-webkit-keyframes spin-cw-1turn{0%{-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}100%{-webkit-transform:rotate(0);transform:rotate(0)}}.spin-ccw{-webkit-animation-name:spin-cw-1turn;animation-name:spin-cw-1turn}@keyframes spin-cw-1turn{0%,100%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.wiggle{-webkit-animation-name:wiggle-7deg;animation-name:wiggle-7deg}@-webkit-keyframes wiggle-7deg{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,100%,30%,70%{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes wiggle-7deg{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,100%,30%,70%{-webkit-transform:rotate(0);transform:rotate(0)}}.shake,.spin-ccw,.spin-cw,.wiggle{-webkit-animation-duration:.5s;animation-duration:.5s}.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.slow{-webkit-animation-duration:750ms!important;animation-duration:750ms!important}.fast{transition-duration:250ms!important;-webkit-animation-duration:250ms!important;animation-duration:250ms!important}
</style>
</head>
<body>
<div id="content" class="grid-container">
<div class="grid-x grid-padding-x">
<div class="cell"><br></div>
</div>
<div class="grid-x grid-padding-x">
<div class="cell large-offset-10 costco-logo-160px"></div>
</div>
<div class="grid-x grid-padding-x">
<div>
<h1>AAD JWT decode and validation</h1>
</div>
</div>
<div>
<form data-abide novalidate>
<div class="grid-container grid-container-padded">
<div class="grid-x">
<div class="cell">
<div data-abide-error id="error" class="alert callout" data-closable="slide-out-right" style="display: none;">
<p><i class="fi-alert"></i>There are some errors in JWT token you provided:</p>
<div id="errorDetails"></div>
<button class="close-button" aria-label="Dismiss alert" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
</div>
</div>
</div>
<div class="grid-container grid-container-padded">
<div class="grid-x">
<div class="cell">
<div id="success" class="callout success" data-closable="slide-out-right" style="display: none;">
<p><i class="fi-alert"></i>Signature validated! Well almost, you need to implement the validate method...</p>
<button class="close-button" aria-label="Dismiss alert" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
</div>
</div>
</div>
</div>
<div class="grid-x grid-margin-x">
<div class="large-12 auto cell">
<div class="loading-overlay" id="loadingSpinner" style="display: none"></div>
</div>
</div>
<div class="grid-x grid-margin-x">
<div class="small-6 auto cell">
<label>Paste in your encoded JWT token (leaving this field starts the validation process):
<textarea id="token" type="text" placeholder="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWV9.TJVA95OrM7E2cBab30RMHrHDcEfxjoYZgeFONFh7HgQ" required rows="12" onBlur=window.app.decode()></textarea>
<span class="form-error">
Yo, you had better fill this out, it's required.
</span>
</label>
</div>
<div class="small-6 auto cell">
<label>Decoded claims:
<textarea id="claims" type="text" placeholder="" rows="12">
</textarea>
</label>
</div>
</div>
</div>
</form>
<div id="footer" class="grid-container grid-container-padded">
<div class="grid-x grid-padding-x">
<div id="footer-text" class="cell text-center" style="display: none">
<h5>&copy; Copyright Costco Wholesale Corporation <span id="currentYear"></span></h5>
</div>
</div>
<div>
<script>
window.app = {
start: function() {
//Put your startup code here...
document.getElementById('currentYear').innerHTML = (new Date()).getFullYear();
document.getElementById('footer-text').style.display = '';
},
decode: function() {
const code = undefined; //Put the Azure code for JWTTokenDecode here!!!
if (!code) {
document.getElementById('errorDetails').innerHTML = "MISSING: Please set the key or code for the decode Azure function";
document.getElementById('error').style.display = '';
return;
}
const token = document.getElementById('token').value;
if (!token) {
document.getElementById('errorDetails').innerHTML = "MISSING: Please provide a token";
document.getElementById('error').style.display = '';
return;
}
const url = `https://iam-azurelambdafunctions.azurewebsites.net/api/JWTTokenDecode?code=${code}&token=${token}`;
if (document.getElementById('loadingSpinner').style.display = 'none') {
$('#loadingSpinner').toggle();
}
fetch(url).then(function(response) {
return response.json();
}).then(function(json) {
$('#loadingSpinner').toggle();
if (json.statusCode && json.statusCode !== 200) {
document.getElementById('errorDetails').innerHTML = JSON.stringify(json, null, 2);
document.getElementById('error').style.display = '';
} else {
let payload = JSON.stringify(json, null, 2)
document.getElementById('claims').value = payload;
if (json.aud && json.tid && json.iss && json.sub) {
window.app.validate(token, payload.aud, payload.tid, payload.iss, payload.sub);
} else {
//Don't have everything we need to validate the token.
document.getElementById('errorDetails').innerHTML = `Decoding issue: One of the following claims are missing: aud, tid, iss or sub. Is your token an Azure AD token?`;
document.getElementById('error').style.display = '';
}
}
}).catch(function(err) {
console.log(err);
});
},
validate: function(token, aud, tid, iss, sub) {
const code = undefined; //Put the Azure code for AADJWTTokenValidation here!!!
if (!code) {
document.getElementById('errorDetails').innerHTML = "MISSING: Please set the key or code for the validate Azure function";
document.getElementById('error').style.display = '';
return;
}
const url = `https://iam-azurelambdafunctions.azurewebsites.net/api/AADJWTTokenValidation?code=${code}&token=${token}&audience=${aud}&tenantId=${tid}&issuer=${iss}&clientId=${sub}`;
if (document.getElementById('loadingSpinner').style.display = 'none') {
$('#loadingSpinner').toggle();
}
fetch(url).then(function(response) {
return response.text();
}).then(function(text) {
$('#loadingSpinner').toggle();
if (text === 'token is valid') {
document.getElementById('success').style.display = '';
} else {
document.getElementById('errorDetails').innerHTML = `Validation issue: ${text}`;
document.getElementById('error').style.display = '';
}
}).catch(function(err) {
console.log(err);
});
}
};
//Load the app
window.addEventListener('load', function() {
window.app.start();
});
</script>
<script>
$(document).foundation();
</script>
</body>
</html>
@cwatsonc
Copy link

Why do you need to select the encryption algorithm? JWT token header already contains the token algorithm and this value should be discovered by the decoder or the application.

@visualjeff
Copy link
Author

Don't. I've updated the HTML.

Its pretty much done.

Jeff

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment