{
    "componentChunkName": "component---src-pages-blog-markdown-remark-fields-slug-js",
    "path": "/blog/oauth-2-vs-session-management",
    "result": {"data":{"markdownRemark":{"html":"<p>There seems to be a lot of misinformation on when OAuth 2.0 (henceforth referred to as OAuth) is appropriate for use. A lot of developers confuse OAuth with web session management and hence end up using the wrong protocol / set of technologies. This, in turn, leads to security issues. This article will clarify when to use regular session management solutions and when to use any one of the OAuth flows.</p>\n<h2 id=\"the-most-important-difference\" style=\"position:relative;\"><a href=\"#the-most-important-difference\" aria-label=\"the most important difference permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>The most important difference</h2>\n<p>Ideally, we would like all authenticated communication to be long lived (to provide the best user experience). The difference between user session management and OAuth is the level of trust between the communicating parties.</p>\n<p>While using user sessions, it is assumed that one of the two communicating parties is untrusted (your app’s frontend) and the other party is trusted (your app’s backend). In OAuth flows, generally, the two communicating parties are both trusted (i.e. your app’s backend and third party app’s backend). In some OAuth flows, one of the two parties is also untrusted, in which case, it would require a handshake that is ‘short lived’. We will talk more about “trusted parties” in the next section.</p>\n<p>As a result, session management generally refers to communication between your own app’s backend and frontend. Whereas, OAuth is used when your app (frontend or backend) needs to communicate with a third party’s backend – if you use Google / Facebook Sign in for your app or if your app uses Okta / Auth0 for managing users.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 630px; \"\n    >\n      <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/b0c7fa1cb3406371a8ba481c2cf4d043/5a190/oauth_flow.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n    <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 56.32911392405063%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAACB0lEQVQoz42SzW/TQBDF848i+Cu4Im4IiTsSQiDO5dCeekFCKkiAoEqbfiRtbKdJndiOv7322muvf2DHpaq4sNLT7sybeTvSvBFtC62+B7vYczakcUR/+rx+WNejuecGfiSaFq9q8VXLttrBV7DOFVsFfk2f62q6ONQP0eW8gRe1ZuRVmmkB1xKuhnuWa169ecf7g0OMGhaiJixrbsOEM2vJydxiYt5waljYcUZU1Rh5g1u1jALVMhWaa9EwFw2LCmap4tHjJzx78ZIV4BQ1NIo4SQn8LXVVEgUBztoljQS1LFnLQTBs4NdW8uM2YRUXXGU1l3HJ2ImY+ILxNsMRki+nNk9fH+H6Efv7+0RxwmYjWVgp7ibGvhMM6pZJrJlsC27CgLETc2wHjDcxEzfipx3ilxUfDi95/vYraZKwt/eRIAjI84xMpCRRyG0xCHbLuEgbzsOCaSK5FjVTAQefjvg+PWNegVs22LbDcrmkLMt+8UopXNfDWtyQC4Et9d2EcB5X/Fx5nLgJRkmPuaiZ57pfUicYeA6mYSDzvBfTjcb3PCzTRIqM9Z2gr3ZNCwVWBYZsMYoWQ4IpYV7AUmq8sqFzhKfAdF3m9gpvsFrHWYXu36POP5d5y1XeMuvu4l/MCnpr9XUKvhkmn0+OmZW7XMdd5PQfPjD2f6HSf03tD33BMGn2x9i/ARLIPxXygd1JAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"OAuth flow\"\n        title=\"OAuth flow\"\n        src=\"/static/b0c7fa1cb3406371a8ba481c2cf4d043/f058b/oauth_flow.png\"\n        srcset=\"/static/b0c7fa1cb3406371a8ba481c2cf4d043/c26ae/oauth_flow.png 158w,\n/static/b0c7fa1cb3406371a8ba481c2cf4d043/6bdcf/oauth_flow.png 315w,\n/static/b0c7fa1cb3406371a8ba481c2cf4d043/f058b/oauth_flow.png 630w,\n/static/b0c7fa1cb3406371a8ba481c2cf4d043/5a190/oauth_flow.png 800w\"\n        sizes=\"(max-width: 630px) 100vw, 630px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n        decoding=\"async\"\n      />\n  </a>\n    </span></p>\n<p><em>Think about this like global trade. OAuth is the system that lets countries trade with each other, whereas session management is the system that enables trade within a country. You always require local trade – regardless of whether you exchange goods (data) with other countries or not (see “OAuth depends on Session management” section).</em></p>\n<h2 id=\"about-trust\" style=\"position:relative;\"><a href=\"#about-trust\" aria-label=\"about trust permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>About Trust</h2>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 630px; \"\n    >\n      <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/b1e1abf169363c79273a97b1931185fc/5a190/trust.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n    <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 37.34177215189873%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAHCAYAAAAIy204AAAACXBIWXMAAAsSAAALEgHS3X78AAAB6ElEQVQozy2R30tTAQCF9w/VNrfd7W73emelk3oIKbbdXWszWVBSSiSK0Ev4oCUZURBE4IMYpFM33U8To5wxKAp6i/Wg292dSyeBaYzii9wevpfz8ME5x1QVzVQkO1/7hykMTlO49bDJ4GO+hO+y67ZRVKz4Zv0IcRU5dY2b68+ZWMgzFf9IdP0JUroPcSlI+7yKyXBbKcsClc081WOo7B1R+3mEcfyH8sZbDI+dYoedrrkAtkwQJTbEnUfveDD3mfGZAvdefKIzOYJ91Y8cC2EyPDZK7QIHHzZpAL9/NfjbaFA/PKS28QZDclA8I9D5KohtTUWaHyI4liQ6meX20/fcmN6iIzGCPR1AWmwJy4oLYy3L/kGdfaPCXqXCj3odPZPEkISWMIA9qyHEo1y4P0NoNMP1iS2CU0uIqQGEtIrnROi2oitOyoEedvp62Q5rbEc0dsIhSv6LVGVnq7IfR7IXR07DkosgPxvH+3KS0+mr2HIarhUNKfZ/Q9FM1WPj+zkP33q6McIhyhENPRKi3KWwK7ZR9LadnOJMhBBXNNTVAOfzA1wujHIpP4wreQVxWW2eUnWdwhAt6IqL0lkJ3aeg+7xNvC5qTjNFxUL3rB/3oop7WUVOaLhTYeR0P3Iy0swWVLyvVf4BkoBoshpGrTUAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Trusted\"\n        title=\"Trusted\"\n        src=\"/static/b1e1abf169363c79273a97b1931185fc/f058b/trust.png\"\n        srcset=\"/static/b1e1abf169363c79273a97b1931185fc/c26ae/trust.png 158w,\n/static/b1e1abf169363c79273a97b1931185fc/6bdcf/trust.png 315w,\n/static/b1e1abf169363c79273a97b1931185fc/f058b/trust.png 630w,\n/static/b1e1abf169363c79273a97b1931185fc/5a190/trust.png 800w\"\n        sizes=\"(max-width: 630px) 100vw, 630px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n        decoding=\"async\"\n      />\n  </a>\n    </span></p>\n<p>Put simply, in any app, the frontend is untrusted, whereas the backend is trusted. This is because the backend is under strict control of the app developers who generally mean no harm to the users or to the app<a href=\"#footnote\">[1]</a>. In contrast, the app developers have no control over the frontend. The frontend device could be compromised via social engineering techniques or malware, and there is nothing the app developers can do to mitigate that.</p>\n<p>If a frontend is compromised, then the attacker may have an easy way to “harm” the app or its users. Hence, it is advisable that no data being sent from the frontend be blindly trusted. We must always verify and sanitize the incoming data, and try to minimise risk as far as possible.</p>\n<h2 id=\"oauth-depends-on-session-management\" style=\"position:relative;\"><a href=\"#oauth-depends-on-session-management\" aria-label=\"oauth depends on session management permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>OAuth depends on Session management</h2>\n<p>In order to show this dependency, let’s examine the different ways two apps can communicate with each other using the Authorisation code grant flow<a href=\"#footnote\">[2]</a>. The setup is that we have two apps: “<span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>” and “<span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>”.</p>\n<p><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span> has the following components:</p>\n<ul>\n<li>A frontend (untrusted)</li>\n<li>An optional backend server</li>\n</ul>\n<p><span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span> has the following components:</p>\n<ul>\n<li>A frontend (untrusted)</li>\n<li>A backend</li>\n</ul>\n<p>Now, let’s see the different access patterns:</p>\n<ol>\n<li>\n<p><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span> has a backend server</p>\n<p>a) <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend wants to access <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s backend server\nb) <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend / backend wants to access <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend server.</p>\n</li>\n<li>\n<p><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span> doesn’t have a backend server</p>\n<p>a) <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend wants to access <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend server</p>\n</li>\n</ol>\n<h3 id=\"access-pattern-1a\" style=\"position:relative;\"><a href=\"#access-pattern-1a\" aria-label=\"access pattern 1a permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Access pattern 1a)</h3>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 630px; \"\n    >\n      <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/d0a6f51a1121f1132d36a5c64664de55/5a190/architecture.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n    <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 56.32911392405063%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAAB0UlEQVQoz22TzaoUMRCF+318E1e+hFtxJT6AS5civoIggoLgQnShO93cjeB1rnNR506m/3+S7qSTyic9M93joAVFQ9U5JzlV6WQcR0II+xQghBGRAETkWP9figgxygEngg8B7wOJSGQOd/2e9s19nPpOYyCeWkvMtVZbnr264MtlSvwLmLihRRc/GPsd1fPb3Dy6hf72CaUKfF8hriXYBhkNE02O5F3RcefBS+4+/kBW9/zKa8quJ7GDIdttcLZBvb7H9u0TvDUTlRjGQ0og2Ioonvkuk80X777y8OlHam1RaUqrzbnlSTwGfSSc+xXX7AUPtk+90rgzXDINeALsMdFSb6+o62EhzuRZcJZy1rNNNbU79uNhOUdBmUdOnf6mauUfwbAXHJelTLy80nRBzgVnZ95kDOoCpz4jzYoY3NlaDzcMS6nIPJuNZ7V2lHk4We5bhSmu6OqMJl3TFhvSm2vMYJkOCyKECOPQEGwJYvBmy04VqK0mVfX+RfzMKtJak3RtRZnd0GlN23X7b5oXFNoyhMjghd4LTiIqa1itU9SuROsGrTVNW1OWBSrLqZqWZJ7J9McYY+j7nmEYYJnrYbZT9GakyHuMGXHOLnhrT5v+A2M2UE+dNP6wAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Architecture\"\n        title=\"Architecture\"\n        src=\"/static/d0a6f51a1121f1132d36a5c64664de55/f058b/architecture.png\"\n        srcset=\"/static/d0a6f51a1121f1132d36a5c64664de55/c26ae/architecture.png 158w,\n/static/d0a6f51a1121f1132d36a5c64664de55/6bdcf/architecture.png 315w,\n/static/d0a6f51a1121f1132d36a5c64664de55/f058b/architecture.png 630w,\n/static/d0a6f51a1121f1132d36a5c64664de55/5a190/architecture.png 800w\"\n        sizes=\"(max-width: 630px) 100vw, 630px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n        decoding=\"async\"\n      />\n  </a>\n    </span></p>\n<p>One way of doing this is to simply use session management between your frontend and backend. Another method, if you are using an external identity management solution like Okta or Auth0, is:</p>\n<ol>\n<li><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend redirects the user to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span> (1.1) where the user logs into <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend which talks to its backend via session management (1.2).</li>\n<li>Upon successful authentication, <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend issues a short lived access token<a href=\"#footnote\">[3]</a> which is stored on <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend.</li>\n<li><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend then uses this access token to talk to <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s backend.</li>\n<li>When this access token expires, the user is redirected to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend. If the session between <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend and backend is still alive, then a new access token is immediately issued to <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend, (via the authorisation code) otherwise, the user must login again.</li>\n</ol>\n<h3 id=\"access-pattern-1b\" style=\"position:relative;\"><a href=\"#access-pattern-1b\" aria-label=\"access pattern 1b permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Access pattern 1b)</h3>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 630px; \"\n    >\n      <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/f300672886ee09124e899b9629ac8e40/5a190/access_pattern_a.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n    <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 56.32911392405063%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAABwUlEQVQoz3VSu47UMBTNN/EH/AQVLR0Sf0BLQbtCfAE1okBsT4EoqFhNswzLTCaZvP24ju3YuQcls8nMCvZIx/Lj+Nj3kYzjiAWjFxjz7xCdQVXRvMc8TsPKZR3DgG0u4SOv95kZSRwsOPQY+wL680s0V0/h6j2CI4xOYHTyAaMVQNRoqxQv3lzj6uNPdORhh4ghRCS9blFlt7DlD9TvniB9/xxdV6O3EkQdyFzwfi1khzL/g1dvv+DZ62vcHgS26RGKLJIYI6ZPj8Hi+O0D+jY/h3qarZxCmlCUBEMDjg3h09df8CHO51P6ZsNZPCfRoCtzGDOsObnksrc8NKlaivAunmqwGK6ioFHnBXSPC8N/jRf9ZJO1Ft6Fs+HiFW0LX28QmxuwrQE+V/8hTtXWMuJYBqRFhNHnSiemO0DXW6jqDiq/gcg2qPYbGB/gI+a2uGRgYOqU7KCw+62xu5PY71qklcCxUUiMFqy6kpUiJiKW2nBRNaxcYBeZ/T2neWBwKz1nhWYyirUm1lpw05TcCsWd0pwsn3XOgcjAGIO+7/EYnAtQyp70hma9tfYcshBCTdBaKyJa+RiItDKG/quXUqq/4Z9M4B8tDDMAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Access Pattern\"\n        title=\"Access Pattern\"\n        src=\"/static/f300672886ee09124e899b9629ac8e40/f058b/access_pattern_a.png\"\n        srcset=\"/static/f300672886ee09124e899b9629ac8e40/c26ae/access_pattern_a.png 158w,\n/static/f300672886ee09124e899b9629ac8e40/6bdcf/access_pattern_a.png 315w,\n/static/f300672886ee09124e899b9629ac8e40/f058b/access_pattern_a.png 630w,\n/static/f300672886ee09124e899b9629ac8e40/5a190/access_pattern_a.png 800w\"\n        sizes=\"(max-width: 630px) 100vw, 630px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n        decoding=\"async\"\n      />\n  </a>\n    </span></p>\n<ol>\n<li>The user logs into <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s backend via <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend. Data between the two is exchanged via session management.</li>\n<li>The user authenticates themselves (after a redirection – 2.1) on <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend, which talks to its backend via session management (2.2).</li>\n<li>Upon successful authentication, <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend issues a short lived access token (stored on <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend and / or backend) and a long lived refresh token (stored only in <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s backend, which is trusted).</li>\n<li><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend / backend can now use the access token to talk to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend. When the access token expires, <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s backend can use the refresh token to get a new access token (which can then be sent to <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend).</li>\n</ol>\n<h3 id=\"access-pattern-2a\" style=\"position:relative;\"><a href=\"#access-pattern-2a\" aria-label=\"access pattern 2a permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Access pattern 2a)</h3>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 630px; \"\n    >\n      <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/a0f2375e1ddea09056297bcdad60fe12/5a190/access_pattern_2a.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n    <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 56.32911392405063%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAABsklEQVQoz3WRS44UMRBE60IchStwBm7CAVjPCnEAboDEEqGZBRLdQ1M9Xf+y058ql59RfVFLg6WQU3ZGKCIzi0DaTjQ54fKVaRzIf1cQfEqTSwTzfxB3egLIptERfZdC80j/+R31x7formTwDU4KvG2JwRJHQwz/wPw2KOKgZ0MkSDFGssFpyuszcvpC8eFNuj68xzmLHwfmPyXd7oENe52IcRG9E4xxjRy84vbtE063xwhSijirmNjyMPMWrILT+JpgJK0eSJPF9yVhWghc/7S0TbOxV8HZ217GKRC9Xl/vBVdKCsLllKPtGslbj0i/ReaQ5FjkSJq63f8myEqeXMNQPRGq70RbbqQJa/o1cjriLia1JtU3ocpr+n6f7bxl1zHZClX+Ql1/0OWPVJcnNudYadDSIdJhbY91ikFeeMkbzifh+aw4nyo68Sg7kvV1Tpn/RCnBGIPSlpeiobEBE8AGMGNc7qp3FJ2najWie4yRZSRVdeOc38iLmmxfqXMuicgCa0167dS1TWXhUtv65L1PWuut3x49mVJKidbKGHMHEbmD1lpZaw6sffbo11pmKfUX8FpS+kG9lOwAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Access Pattern 2a\"\n        title=\"Access Pattern 2a\"\n        src=\"/static/a0f2375e1ddea09056297bcdad60fe12/f058b/access_pattern_2a.png\"\n        srcset=\"/static/a0f2375e1ddea09056297bcdad60fe12/c26ae/access_pattern_2a.png 158w,\n/static/a0f2375e1ddea09056297bcdad60fe12/6bdcf/access_pattern_2a.png 315w,\n/static/a0f2375e1ddea09056297bcdad60fe12/f058b/access_pattern_2a.png 630w,\n/static/a0f2375e1ddea09056297bcdad60fe12/5a190/access_pattern_2a.png 800w\"\n        sizes=\"(max-width: 630px) 100vw, 630px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n        decoding=\"async\"\n      />\n  </a>\n    </span></p>\n<ol>\n<li><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend redirects the user to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span> (1.1) where the user logs into <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend which talks to its backend via session management (1.2).</li>\n<li>Upon successful authentication, <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend issues a short lived access token<a href=\"#footnote\">[3]</a> which is stored on <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend.</li>\n<li><span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend then uses this access token to talk to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s backend.</li>\n<li>When this access token expires, the user is redirected to <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend. If the session between <span style=\"color:#ff9f09; font-weight: bold; font-style: italic\">OtherApp</span>’s frontend and backend is still alive, then a new access token is immediately issued to <span style=\"color:#36f; font-weight: bold; font-style: italic\">YourApp</span>’s frontend, (via the authorisation code) otherwise, the user must login again.</li>\n</ol>\n<p>We can see that regardless of how two apps want to communicate with each other, there is always a need for session management.</p>\n<h2 id=\"session-management\" style=\"position:relative;\"><a href=\"#session-management\" aria-label=\"session management permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Session management</h2>\n<p>There are numerous methods to implementing session management. Some are easier to implement, but are also less secure. Just like in OAuth, here too, the concept of short lived access and long lived refresh tokens can come into play. However, unlike OAuth, the refresh token can be sent and stored on the frontend as long as it is “one time use” (a.k.a <a href=\"https://tools.ietf.org/html/rfc6819#section-5.2.2.3\" target=\"_blank\" rel=\"nofollow\">rotating refresh tokens</a>). Any other session flow is less secure as per the analysis in <a href=\"https://supertokens.com/blog/all-you-need-to-know-about-user-session-security\" target=\"_blank\" rel=\"nofollow\">this blog post</a>.</p>\n<h2 id=\"difference-in-token-types\" style=\"position:relative;\"><a href=\"#difference-in-token-types\" aria-label=\"difference in token types permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Difference in token types</h2>\n<p>A final difference is that OAuth and session management may use different types of tokens. In OAuth, the access token issued by the <strong>OtherApp</strong> is used by <strong>YourApp</strong> to make API requests on behalf of the user. This access token allows access to specific parts of a user’s data. This access token is opaque (a long, random string).</p>\n<p>In session management, the access token can be Opaque or a JWT(an encoded signed JSON). There are pros and cons of using either of them as explained in this <a href=\"https://supertokens.com/blog/are-you-using-jwts-for-user-sessions-in-the-correct-way\" target=\"_blank\" rel=\"nofollow\">blog post</a>.</p>\n<h2 id=\"conclusion\" style=\"position:relative;\"><a href=\"#conclusion\" aria-label=\"conclusion permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Conclusion:</h2>\n<p>The core difference between OAuth and session management is one of trust. Using session management, one can maintain a long lived, authenticated connection between an untrusted party (frontend) and a trusted party (both within the same app). Whereas using OAuth, one can maintain a long lived, authenticated connection between two trusted parties – both being the backend of different services.</p>\n<p>If you liked this blog, you may also like other blogs from us:</p>\n<ul>\n<li><a href=\"https://supertokens.com/blog/all-you-need-to-know-about-user-session-security\" target=\"_blank\" rel=\"nofollow\">All you need to know about user session security</a></li>\n<li><a href=\"https://supertokens.com/blog/the-best-way-to-securely-manage-user-sessions\" target=\"_blank\" rel=\"nofollow\">The best way to securely manage user sessions</a></li>\n</ul>\n<h2 id=\"footnote\" style=\"position:relative;\"><a href=\"#footnote\" aria-label=\"footnote permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Footnote:</h2>\n<p>[1]: Backend data breaches and insider threats do occur. However, these events are much more “controllable” by app developers than, for example, a malware on the end user’s computer.</p>\n<p>[2]: When describing the flows, we will not mention the authorisation code step via client secret or PKCE for brevity.</p>\n<p>[3]: The backend only issues an access token since that is short lived and it cannot trust the frontend to securely store a non-changing long lived token (refresh token).</p>","frontmatter":{"date":"April 24, 2020","title":"OAuth 2.0 vs Session Management","cover":"oauth-2-vs-session-management.png","author":"Rishabh Poddar","description":"A lot of developers confuse OAuth with web session management and hence end up using the wrong protocol. This article will clarify when to use what solution."},"fields":{"slug":"/oauth-2-vs-session-management/"}},"site":{"siteMetadata":{"title":"SuperTokens Blog"}}},"pageContext":{"id":"d90e2827-b617-5d94-b7eb-fd5a0da02cb4","fields__slug":"/oauth-2-vs-session-management/","__params":{"fields__slug":"oauth-2-vs-session-management"}}},
    "staticQueryHashes": []}