You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
})(window,document,'script','dataLayer','GTM-PT2SNS');</script><!-- End Google Tag Manager —>--><navclass="navbar closed"><divclass="container"><divclass="top-mobile"><divclass="menu-trigger"><span></span></div><ahref="/" class="brand"><imgsrc="/img/pic_logo.svg" class="icon"><imgsrc="/img/logo.svg" class="logo"></a></div><navclass="menu"><ahref="/#debugger" class="scrollto">Debugger</a><ahref="/#libraries" class="scrollto">Libraries</a><ahref="/introduction" class="active">Introduction</a><ahref="https://ask.auth0.com/category/jwt" target="_blank">Ask</a><ahref="http://swag.auth0.com/" target="_blank">Get a T-shirt!</a></nav><divclass="social"><ahref="https://auth0.com/" target="_blank" class="a0"><imgsrc="/img/ico_a0_white.svg"></a><ahref="https://twitter.com/auth0" target="_blank" class="twitter"><imgsrc="/img/ico_twitter.svg"></a></div><ahref="https://auth0.com/" target="_blank" class="supported">Supported by<imgsrc="/img/ico_logo.svg"></a></div></nav><sectionclass="banner-jwt"><divclass="container"><ahref="/" class="logo"><imgsrc="/img/pic_logo.svg"></a><h1>Introduction to JSON Web Tokens</h1></div></section><sectionclass="video-content"><divclass="container"><iframesrc="//fast.wistia.net/embed/iframe/dxfz716cw9?videoFoam=true&controlsVisibleOnLoad=false&vmode=transparent&preload=metadata&playerColor=292929" allowtransparency="true" frameborder="0" scrolling="no" name="wistia_embed" allowfullscreenmozallowfullscreenwebkitallowfullscreenoallowfullscreenmsallowfullscreenclass="intro-video wistia_embed"></iframe></div></section><sectionclass="plain-text"><divclass="container"><h2id="what-is-json-web-token-">What is JSON Web Token?</h2>
6
-
<p>JSON Web Token (JWT) is an open standard (<ahref="https://tools.ietf.org/html/rfc7519">RFC 7519</a>) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with <strong>HMAC</strong> algorithm) or a public/private key pair using <strong>RSA</strong>.</p>
6
+
<p>JSON Web Token (JWT) is an open standard (<ahref="https://tools.ietf.org/html/rfc7519">RFC 7519</a>) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the <strong>HMAC</strong> algorithm) or a public/private key pair using <strong>RSA</strong>.</p>
7
7
<p>Let's explain some concepts of this definition further.</p>
8
8
<ul>
9
-
<li><p><strong>Compact</strong>: Because of its size, it can be sent through an URL, POST parameter, or inside an HTTP header. Additionally, due to its size its transmission is fast.</p>
9
+
<li><p><strong>Compact</strong>: Because of its smaller size, JWTs can be sent through an URL, POST parameter, or inside an HTTP header. Additionally, the smaller size means transmission is fast.</p>
10
10
</li>
11
-
<li><p><strong>Self-contained</strong>: The payload contains all the required information about the user, to avoid querying the database more than once.</p>
11
+
<li><p><strong>Self-contained</strong>: The payload contains all the required information about the user, avoiding the need to query the database more than once.</p>
12
12
</li>
13
13
</ul>
14
14
<h2id="when-should-you-use-json-web-tokens-">When should you use JSON Web Tokens?</h2>
15
-
<p>There are some scenarios where JSON Web Tokens are useful:</p>
15
+
<p>Here are some scenarios where JSON Web Tokens are useful:</p>
16
16
<ul>
17
-
<li><p><strong>Authentication</strong>: This is the typical scenario for using JWT, once the user is logged in, each subsequent request will include the JWT, allowing the user to access routes, services, and resources that are permitted with that token. Single Sign On is a feature that widely uses JWT nowadays, because of its small overhead and its ability to be easily used among systems of different domains.</p>
17
+
<li><p><strong>Authentication</strong>: This is the most common scenario for using JWT. Once the user is logged in, each subsequent request will include the JWT, allowing the user to access routes, services, and resources that are permitted with that token. Single Sign On is a feature that widely uses JWT nowadays, because of its small overhead and its ability to be easily used across different domains.</p>
18
18
</li>
19
-
<li><p><strong>Information Exchange</strong>: JSON Web Tokens are a good way of securely transmitting information between parties, because as they can be signed, for example using public/private key pairs, you can be sure that the senders are who they say they are. Additionally, as the signature is calculated using the header and the payload, you can also verify that the content hasn't changed.</p>
19
+
<li><p><strong>Information Exchange</strong>: JSON Web Tokens are a good way of securely transmitting information between parties, because as they can be signed, for example using public/private key pairs, you can be sure that the senders are who they say they are. Additionally, as the signature is calculated using the header and the payload, you can also verify that the content hasn't been tampered with.</p>
20
20
</li>
21
21
</ul>
22
-
<h2id="which-is-the-json-web-token-structure-">Which is the JSON Web Token structure?</h2>
22
+
<h2id="what-is-the-json-web-token-structure-">What is the JSON Web Token structure?</h2>
23
23
<p>JSON Web Tokens consist of three parts separated by dots (<code>.</code>), which are:</p>
24
24
<ul>
25
25
<li>Header</li>
@@ -30,7 +30,7 @@ <h2 id="which-is-the-json-web-token-structure-">Which is the JSON Web Token stru
30
30
<p><code>xxxxx.yyyyy.zzzzz</code></p>
31
31
<p>Let's break down the different parts.</p>
32
32
<h3id="header">Header</h3>
33
-
<p>The header <em>typically</em> consists of two parts: the type of the token, which is JWT, and the hashing algorithm such as HMAC SHA256 or RSA.</p>
33
+
<p>The header <em>typically</em> consists of two parts: the type of the token, which is JWT, and the hashing algorithm being used, such as HMAC SHA256 or RSA.</p>
34
34
<p>For example:</p>
35
35
<pre><code>{
36
36
"alg": "HS256",
@@ -41,7 +41,7 @@ <h3 id="payload">Payload</h3>
41
41
<p>The second part of the token is the payload, which contains the claims. Claims are statements about an entity (typically, the user) and additional metadata.
42
42
There are three types of claims: <em>reserved</em>, <em>public</em>, and <em>private</em> claims.</p>
43
43
<ul>
44
-
<li><p><strong>Reserved claims</strong>: These are a set of predefined claims, which are not mandatory but recommended, thought to provide a set of useful, interoperable claims. Some of them are: <strong>iss</strong> (issuer), <strong>exp</strong> (expiration time), <strong>sub</strong> (subject), <strong>aud</strong> (audience), among others.</p>
44
+
<li><p><strong>Reserved claims</strong>: These is a set of predefined claims which are not mandatory but recommended, to provide a set of useful, interoperable claims. Some of them are: <strong>iss</strong> (issuer), <strong>exp</strong> (expiration time), <strong>sub</strong> (subject), <strong>aud</strong> (audience), and others.</p>
45
45
<blockquote>
46
46
<p>Notice that the claim names are only three characters long as JWT is meant to be compact.</p>
47
47
</blockquote>
@@ -60,36 +60,36 @@ <h3 id="payload">Payload</h3>
60
60
</code></pre><p>The payload is then <strong>Base64Url</strong> encoded to form the second part of the JSON Web Token.</p>
61
61
<h3id="signature">Signature</h3>
62
62
<p>To create the signature part you have to take the encoded header, the encoded payload, a secret, the algorithm specified in the header, and sign that.</p>
63
-
<p>For example if you want to use the HMAC SHA256 algorithm, the signature will be created in the following way.</p>
63
+
<p>For example if you want to use the HMAC SHA256 algorithm, the signature will be created in the following way:</p>
64
64
<pre><code>HMACSHA256(
65
65
base64UrlEncode(header) + "." +
66
66
base64UrlEncode(payload),
67
67
secret)
68
-
</code></pre><p>The signature is used to verify that the sender of the JWT is who it says it is and to ensure that the message was't changed in the way.</p>
68
+
</code></pre><p>The signature is used to verify that the sender of the JWT is who it says it is and to ensure that the message wasn't changed along the way.</p>
69
69
<h3id="putting-all-together">Putting all together</h3>
70
-
<p>The output is three Base64 strings separated by dots that can be easily passed in HTML and HTTP environments, while being more compact compared to XML-based standards such as SAML.</p>
70
+
<p>The output is three Base64 strings separated by dots that can be easily passed in HTML and HTTP environments, while being more compact when compared to XML-based standards such as SAML.</p>
71
71
<p>The following shows a JWT that has the previous header and payload encoded, and it is signed with a secret.
<p>If you want to play with JWT and put these concepts to practice, you can use <ahref="http://jwt.io">jwt.io Debugger</a> to decode, verify and generate JWTs.</p>
73
+
<p>If you want to play with JWT and put these concepts into practice, you can use <ahref="http://jwt.io">jwt.io Debugger</a> to decode, verify, and generate JWTs.</p>
<h2id="how-do-json-web-tokens-work-">How do JSON Web Tokens work?</h2>
76
76
<p>In authentication, when the user successfully logs in using his credentials, a JSON Web Token will be returned and must be saved locally (typically in local storage, but cookies can be also used), instead of the traditional approach of creating a session in the server and returning a cookie.</p>
77
-
<p>Whenever the user wants to access a protected route or resource, it should send the JWT, typically in the <strong>Authorization</strong> header using the <strong>Bearer</strong> schema. Therefore the content of the header should look like the following.</p>
77
+
<p>Whenever the user wants to access a protected route or resource, the user agent should send the JWT, typically in the <strong>Authorization</strong> header using the <strong>Bearer</strong> schema. The content of the header should look like the following:</p>
78
78
<pre><code>Authorization: Bearer <token>
79
-
</code></pre><p>This is a stateless authentication mechanism as the user state is never saved in the server memory.
80
-
The server's protected routes will check for a valid JWT in the Authorization header, and if there is, the user will be allowed. As JWTs are self-contained, all the necessary information is there, reducing the need of going back and forward to the database.</p>
81
-
<p>This allows to fully rely on data APIs that are stateless and even make requests to downstream services. It doesn't matter which domains are serving your APIs, as Cross-Origin Resource Sharing (CORS) won't be an issue as it doesn't use cookies.</p>
79
+
</code></pre><p>This is a stateless authentication mechanism as the user state is never saved in server memory.
80
+
The server's protected routes will check for a valid JWT in the Authorization header, and if it's present, the user will be allowed to access protected resources. As JWTs are self-contained, all the necessary information is there, reducing the need to query the database multiple times.</p>
81
+
<p>This allows you to fully rely on data APIs that are stateless and even make requests to downstream services. It doesn't matter which domains are serving your APIs, so Cross-Origin Resource Sharing (CORS) won't be an issue as it doesn't use cookies.</p>
82
82
<p>The following diagram shows this process:</p>
83
83
<p><imgsrc="https://cdn.auth0.com/content/jwt/jwt-diagram.png" alt="How does a JSON Web Token works"></p>
84
84
<h2id="why-should-we-use-json-web-tokens-">Why should we use JSON Web Tokens?</h2>
85
-
<p>Let's talk about the benefits of <strong>JSON Web Tokens (JWT)</strong>comparing it to <strong>Simple Web Tokens (SWT)</strong> and <strong>Security Assertion Markup Language Tokens (SAML)</strong>.</p>
86
-
<p>As JSON is less verbose than XML, when it is encoded its size is also smaller; making JWT more compact than SAML. This makes JWT a good choice to be passed in HTML and HTTP environments.</p>
87
-
<p>Security-wise, SWT can only be symmetric signed by a shared secret using the HMAC algorithm. While JWT and SAML tokens can also use a public/private key pair in the form of a X.509 certificate to sign them. However, signing XML with XML Digital Signature without introducing obscure security holes is very difficult compared to the simplicity of signing JSON.</p>
88
-
<p>JSON parsers are common in most programming languages, because they map directly to objects, conversely XML doesn't have a natural document-to-object mapping. This makes it easier to work with JWT than SAML assertions.</p>
89
-
<p>Regarding usage, JWT is used at an Internet scale. This highlights the ease of clientside processing of the JSON Web token on multiple platforms, especially, mobile.</p>
85
+
<p>Let's talk about the benefits of <strong>JSON Web Tokens (JWT)</strong>when compared to <strong>Simple Web Tokens (SWT)</strong> and <strong>Security Assertion Markup Language Tokens (SAML)</strong>.</p>
86
+
<p>As JSON is less verbose than XML, when it is encoded its size is also smaller, making JWT more compact than SAML. This makes JWT a good choice to be passed in HTML and HTTP environments.</p>
87
+
<p>Security-wise, SWT can only be symmetricly signed by a shared secret using the HMAC algorithm. However, JWT and SAML tokens can use a public/private key pair in the form of a X.509 certificate for signing. Signing XML with XML Digital Signature without introducing obscure security holes is very difficult when compared to the simplicity of signing JSON.</p>
88
+
<p>JSON parsers are common in most programming languages because they map directly to objects. Conversely, XML doesn't have a natural document-to-object mapping. This makes it easier to work with JWT than SAML assertions.</p>
89
+
<p>Regarding usage, JWT is used at Internet scale. This highlights the ease of client-side processing of the JSON Web token on multiple platforms, especially mobile.</p>
90
90
<p><imgsrc="https://cdn.auth0.com/content/jwt/comparing-jwt-vs-saml2.png" alt="Comparing the length of an encoded JWT and an encoded SAML">
91
91
<em>Comparison of the length of an encoded JWT and an encoded SAML</em></p>
92
-
<p>If you want to read more about JSON Web Tokens and even start using them to perform authentication in your own applications, browse to the <ahref="http://auth0.com/learn/json-web-tokens">JSON Web Token landing page</a>in Auth0.</p>
92
+
<p>If you want to read more about JSON Web Tokens and even start using them to perform authentication in your own applications, browse to the <ahref="http://auth0.com/learn/json-web-tokens">JSON Web Token landing page</a>at Auth0.</p>
93
93
</div></section><sectionclass="go-tool"><divclass="container"><p>Get started with JWT today</p><ahref="/#debugger" class="btn btn-success">Start using the tool</a></div></section><divclass="tokens-created"><divclass="container"><imgsrc="/img/pic_logo_ft.svg"><p>JWT.io is brought to you by Auth0.</p><p>A cloud service, APIs and tools that eliminate the friction of identity for your applications and APIs.</p><ahref="https://auth0.com/signup" target="_blank" class="btn btn-success">Create free account</a><divclass="token"><h5>TOKENS CREATED</h5></div><divclass="counter"></div></div></div><footer><divclass="container"><divclass="columns"><divclass="column"><ahref="https://auth0.com/" target="_blank">Supported by<imgsrc="/img/ico_logo.svg"></a></div><divclass="column pull-request"><span>Missing something?</span><ahref="https://github.com/jsonwebtoken/jsonwebtoken.github.io/tree/master/views" target="_blank">Send a Pull Request</a></div><divclass="column social-counter"><ahref="https://twitter.com/auth0" data-show-count="true" class="twitter-follow-button">Follow @auth0</a></div></div></div></footer><!--Bootstrap core JavaScript
94
94
==================================================--><!-- Placed at the end of the document so the pages load faster--><scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script><scriptsrc="/js/bootstrap.min.js"></script><scriptsrc="//fast.wistia.net/assets/external/E-v1.js" async></script><!-- build:js dist/js/app.js--><scriptsrc="/vendor/zepto/zepto.js"></script><scriptsrc="/vendor/jsonlint/lib/jsonlint.js"></script><scriptsrc="/vendor/json-sans-eval-min/index.js"></script><scriptsrc="/vendor/codemirror/lib/codemirror.js"></script><scriptsrc="/vendor/codemirror/mode/javascript/javascript.js"></script><scriptsrc="/vendor/codemirror/addon/lint/lint.js"></script><scriptsrc="/vendor/codemirror/addon/lint/javascript-lint.js"></script><scriptsrc="/vendor/codemirror/addon/lint/json-lint.js"></script><scriptsrc="/vendor/jsrsasign/index.js"></script><scriptsrc="/vendor/jws.js/index.js"></script><scriptsrc="/js/jwt_mode.js"></script><scriptsrc="/js/jwt.js"></script><scriptsrc="/js/isotope.pkgd.min.js"></script><scriptsrc="/js/flipclock.js"></script><scriptsrc="/js/accordion.js"></script><scriptsrc="/js/highlight.min.js"></script><scriptsrc="/js/app.js"></script><!-- endbuild--><script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
0 commit comments