<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Christopher Oezbek</title>
    <description>The latest articles on DEV Community by Christopher Oezbek (@christopher_oezbek).</description>
    <link>https://dev.to/christopher_oezbek</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2254507%2Ffc6ca373-530d-4ffb-ae8a-ba1ababf0866.png</url>
      <title>DEV Community: Christopher Oezbek</title>
      <link>https://dev.to/christopher_oezbek</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/christopher_oezbek"/>
    <language>en</language>
    <item>
      <title>Mission impossible with localhost</title>
      <dc:creator>Christopher Oezbek</dc:creator>
      <pubDate>Tue, 22 Oct 2024 22:01:49 +0000</pubDate>
      <link>https://dev.to/christopher_oezbek/mission-impossible-with-localhost-8dj</link>
      <guid>https://dev.to/christopher_oezbek/mission-impossible-with-localhost-8dj</guid>
      <description>&lt;p&gt;Did you know that browsers support using &lt;code&gt;localhost&lt;/code&gt; subdomains such as &lt;code&gt;app.localhost&lt;/code&gt; to access &lt;code&gt;127.0.0.1&lt;/code&gt;?&lt;/p&gt;

&lt;p&gt;Do you also know that it is impossible to make those subdomains work with oauth?&lt;/p&gt;

&lt;p&gt;Of course, there is not a single culprit for this, but two:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The Oauth providers such as Microsoft and Google won't allow you to define &lt;a href="http://app.localhost" rel="noopener noreferrer"&gt;http://app.localhost&lt;/a&gt; as the beginning of the callback URL. All callback URLs either must have https or must start with &lt;a href="http://localhost" rel="noopener noreferrer"&gt;http://localhost&lt;/a&gt; (and they are smart enough not to allow &lt;a href="http://localhost.app.localhost" rel="noopener noreferrer"&gt;http://localhost.app.localhost&lt;/a&gt;). So you can't receive a callback to &lt;a href="http://app.localhost" rel="noopener noreferrer"&gt;http://app.localhost&lt;/a&gt;. Only to &lt;code&gt;http://localhost&lt;/code&gt;. &lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;You might think that's easy. Just callback to &lt;a href="http://localhost" rel="noopener noreferrer"&gt;http://localhost&lt;/a&gt; and then redirect back to &lt;a href="http://app.localhost" rel="noopener noreferrer"&gt;http://app.localhost&lt;/a&gt;. Unfortunately, this fails due to culprit 2:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The browsers will not let you share cookies for &lt;a href="http://app.localhost" rel="noopener noreferrer"&gt;http://app.localhost&lt;/a&gt; and &lt;a href="http://localhost" rel="noopener noreferrer"&gt;http://localhost&lt;/a&gt; because they treat localhost as a special case. Even though they allow you to set cookies for localhost when you perform a request to &lt;a href="http://localhost" rel="noopener noreferrer"&gt;http://localhost&lt;/a&gt;, the browser won't allow you to define it as the &lt;code&gt;domain=localhost&lt;/code&gt; when setting the cookie. Localhost is treated like a public suffix (just as &lt;code&gt;com&lt;/code&gt; or &lt;code&gt;org&lt;/code&gt;) and which you can't set cookies on.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Such restrictions don't exist if you wanted to share cookies between &lt;code&gt;app1.foo.localhost&lt;/code&gt; and &lt;code&gt;app2.foo.localhost&lt;/code&gt;. There you could set both cookies for the domain &lt;code&gt;foo.localhost&lt;/code&gt; and they would be shared between app1 and app2. But due to point 1. above (only &lt;a href="http://localhost" rel="noopener noreferrer"&gt;http://localhost&lt;/a&gt;) you can't use &lt;a href="http://foo.localhost%60" rel="noopener noreferrer"&gt;http://foo.localhost`&lt;/a&gt; as the shared callback URL.&lt;/p&gt;

&lt;p&gt;Other solutions are also out of the questions:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;lvh.me or editing of the /etc/hosts file won't help, because you still can't callback to them (no https).&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;What remains are only paid options&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ngrok (need to pay for a static subdomain) or Cloudflare tunnels&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Compare with:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://hackernoon.com/local-development-with-subdomains-mobile-testing-and-oauth-is-it-more-cost-effective?source=rss" rel="noopener noreferrer"&gt;https://hackernoon.com/local-development-with-subdomains-mobile-testing-and-oauth-is-it-more-cost-effective?source=rss&lt;/a&gt;&lt;/p&gt;

</description>
      <category>devops</category>
      <category>oauth</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
