[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"academy-blogs-en-1-1-all-how-to-use-cloudflare-tunnel-localhost-all--*":3,"academy-blog-translations-98jiz88lg5ihh7t":76},{"data":4,"page":75,"perPage":75,"totalItems":75,"totalPages":75},[5],{"alt":6,"collectionId":7,"collectionName":8,"content":9,"cover_image":10,"cover_image_path":11,"created":12,"created_by":13,"expand":14,"id":70,"keywords":71,"locale":44,"published_at":72,"scheduled_at":13,"school_blog":66,"short_description":73,"status":64,"title":6,"updated":74,"updated_by":13,"slug":67,"views":69},"How to Use Cloudflare Tunnel to Expose Localhost Without Port Forwarding","sclblg987654321","school_blog_translations","\u003Cp>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Every developer has faced this struggle: You’ve finished a project on your localhost and need to show it to a client, or you need to test webhooks from services like Stripe, Facebook, or Line. However, network issues get in the way. Setting up Port Forwarding on a router is tedious, and most home internet connections today use \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Private IP (CGNAT)\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">, making port opening nearly impossible.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Today, \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Superdev Academy\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> will introduce you to the best modern solution: \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Cloudflare Tunnel\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:0pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch2 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">What is Cloudflare Tunnel?\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Cloudflare Tunnel\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> (formerly known as Argo Tunnel) is a component of the \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Cloudflare Zero Trust\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> ecosystem. It creates a secure \"pipe\" between your local server (whether at home, in an office, or a data center) and Cloudflare’s global network.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>The Magic Part:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Normally, to access your site, users must travel to your server (Inbound). But with Cloudflare Tunnel, your server reaches out to Cloudflare (Outbound). This means you don't have to open a single port on your router!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:0pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch3>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Why Choose Cloudflare Tunnel? (vs. ngrok)\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Free & Unlimited:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Unlike ngrok’s free tier, Cloudflare doesn’t limit your connection time or bandwidth.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Use Your Own Domain:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> You can instantly connect your local service to any domain managed on Cloudflare.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>High Security:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Your home Public IP remains hidden. You get Cloudflare’s world-class DDoS protection and WAF for free.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Automatic HTTPS:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Say goodbye to SSL certificate headaches. Cloudflare handles the encryption for you.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003Cp>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>🔒 Zero Attack Surface: Total Security\u003C\u002Fstrong>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Traditional Port Forwarding is like leaving a window cracked open—it's an entry point for hackers to scan for vulnerabilities. Cloudflare Tunnel allows you to keep all your \"doors\" locked. Since it uses outbound connections and hides your Public IP, your local environment is essentially invisible to the public internet (Zero Attack Surface).\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Cfigure class=\"image image_resized\" style=\"width:75%;\">\u003Cimg style=\"aspect-ratio:1920\u002F1920;\" src=\"https:\u002F\u002Fimagedelivery.net\u002Fg5Z0xlCQah-oO61sLqaEUA\u002FCloudflare_Tunnel_4501228d86\u002Ftwsme\" alt=\"Cloudflare Tunnel.webp\" width=\"1920\" height=\"1920\">\u003C\u002Ffigure>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cmeta charset=\"utf-8\">\u003C\u002Fp>\u003Ch2>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">🛠 Prerequisites\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:12pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">To ensure a smooth and speedy Cloudflare Tunnel setup, please have these three essentials ready:\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Ch3>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">1. Cloudflare Account (Free Account)\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Why you need it:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> You will use the Cloudflare Zero Trust dashboard to create, configure, and manage your tunnels.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Pro Tip:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> A \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Free Plan\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> is more than enough for basic Tunnel features. There is no need to upgrade to a paid tier for this. Sign up at\u003C\u002Fspan>\u003C\u002Fspan>\u003Ca style=\"text-decoration:none;\" target=\"_blank\" rel=\"noopener noreferrer\" href=\"https:\u002F\u002Fdash.cloudflare.com\u002F\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1155cc;font-family:Arial,sans-serif;\">\u003Cspan style=\"-webkit-text-decoration-skip:none;font-style:normal;font-variant:normal;font-weight:400;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cu>dash.cloudflare.com\u003C\u002Fu>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fa>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003Cp> \u003C\u002Fp>\u003Ch3>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">2. Domain Name Managed via Cloudflare DNS\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:12pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">This is the heart of the setup; Cloudflare Tunnel won't function without a domain to act as its anchor.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>What to check:\u003C\u002Fstrong>\u003C\u002Fspan>\u003C\u002Fspan>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Status: Active:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Double-check your Cloudflare Dashboard to ensure your domain is marked with a green \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>\"Active\"\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> status.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>DNS Migration:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> If your domain is registered elsewhere (such as GoDaddy or Namecheap), ensure you have successfully pointed your Name Servers to Cloudflare.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Why?\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> The Tunnel will automatically create \"shortcuts\" (CNAME records) for you within your DNS settings. It’s incredibly convenient!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003Cp> \u003C\u002Fp>\u003Ch3>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">3. A Service or Application Running on Localhost\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Why you need it:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> The tunnel acts as a bridge; you must have a \"destination\" ready for the traffic to reach.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:disc;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Examples:\u003C\u002Fstrong>\u003C\u002Fspan>\u003C\u002Fspan>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Web Apps:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> If you are running Next.js, React, or Vue locally, identify your port (e.g., \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#188038;font-family:'Roboto Mono',monospace;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">http:\u002F\u002Flocalhost:3000\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">).\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Backend:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> If it’s an API written in Go, Python, or Node.js (e.g., \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#188038;font-family:'Roboto Mono',monospace;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">http:\u002F\u002Flocalhost:8080\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">).\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#000000;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Docker:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> If running via a container, ensure the container is active and you know its internal port.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003C\u002Ful>\u003Cp>\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>💡 Quick Tip:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Before configuring the tunnel, make sure you can actually access your app in your own browser via localhost. This confirms that your service is healthy and ready to go global!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:0pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch2 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Step-by-Step: Installation & Configuration\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">We will use the \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Remote Config\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> method via the Cloudflare Dashboard, which is the easiest way to manage your tunnels.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Ch3 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">1. Create a Tunnel in the Dashboard\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Col style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Go to the\u003C\u002Fspan>\u003C\u002Fspan>\u003Ca style=\"text-decoration:none;\" target=\"_blank\" rel=\"noopener noreferrer\" href=\"https:\u002F\u002Fone.dash.cloudflare.com\u002F\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#0b57d0;font-family:Arial,sans-serif;\">\u003Cspan style=\"-webkit-text-decoration-skip:none;font-style:normal;font-variant:normal;font-weight:400;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cu>Cloudflare Zero Trust Dashboard\u003C\u002Fu>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fa>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Navigate to \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Networks > Tunnels\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Click \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Add a Tunnel\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">, select \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Cloudflare\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> (Managed), and give it a name (e.g., \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">superdev-local-server\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">).\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Fol>\u003Cp> \u003C\u002Fp>\u003Ch3 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">2. Install the Connector (The Docker Way)\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Cloudflare provides commands for various OS, but for the \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Superdev\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> community, we highly recommend \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Docker\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> for a clean, isolated setup.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Copy the command with your unique token from the dashboard and run it in your terminal:\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Cpre>\u003Ccode class=\"language-plaintext\">Bash\ndocker run cloudflare\u002Fcloudflared:latest tunnel --no-autoupdate run --token <YOUR_TOKEN_HERE>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cp style=\"background-color:#f0f4f9;line-height:1.38;margin-bottom:0pt;margin-top:0pt;padding:0pt 0pt 12pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Once running, the status on your dashboard will turn \u003C\u002Fspan>\u003Cspan style=\"font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Healthy\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch3 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">3. Configure Public Hostname\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh3>\u003Cp style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Tell Cloudflare which domain should point to your local app:\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Col style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">In the Tunnel settings, go to the \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Public Hostname\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> tab.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Subdomain:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> e.g., \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">dev\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Domain:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Select your domain from the dropdown.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Service Type:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Select \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">HTTP\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:decimal;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"1\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>URL:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> * \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>For Non-Docker apps:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Enter \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">localhost:3000\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003Cul style=\"margin-bottom:0;margin-top:0;padding-inline-start:48px;\">\u003Cli style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;font-size:11pt;font-style:normal;font-variant:normal;font-weight:400;list-style-type:circle;text-decoration:none;vertical-align:baseline;white-space:pre;\" dir=\"ltr\" aria-level=\"2\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>If the Tunnel is in Docker (Step 2):\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> Enter \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">host.docker.internal:3000\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003C\u002Fol>\u003Cp>\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>💡 Docker Tip:\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> We use \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">host.docker.internal\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> because \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">localhost\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> inside a container refers to the container itself. This special address tells the Cloudflare connector to look at your host machine instead.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:0pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch2 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Test it Out!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">You can now access your local project via \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">https:\u002F\u002Fdev.yourdomain.com\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> from anywhere in the world! Whether you are on hotel Wi-Fi or behind a strict corporate firewall, Cloudflare Tunnel will work seamlessly.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#d32f2f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Note: The first load might feel slightly slower than localhost as the data travels through Cloudflare's edge network, but the security and accessibility are well worth it.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:0pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Ch2 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Pro Tip: Secure it with Zero Trust Access\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">If you are sharing this URL only for internal team reviews, you can add an extra layer of security. Go to \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Access > Applications\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> and create a login gate. You can restrict access to only users with a specific email (e.g., \u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:#e9eef6;color:#444746;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">@yourcompany.com\u003C\u002Fspan>\u003C\u002Fspan>\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">). This is \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>FREE\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\"> for up to 50 users!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Chr>\u003Cp> \u003C\u002Fp>\u003Ch2 style=\"line-height:1.38;margin-bottom:6pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Conclusion\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fh2>\u003Cp> \u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Cloudflare Tunnel is a game-changer for developers. It’s secure, convenient, and cost-effective. If you are still struggling with port forwarding or paying for premium tunneling services, it’s time to switch.\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\">\u003Cspan style=\"background-color:transparent;color:#1f1f1f;font-family:Arial,sans-serif;\">\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">Stay tuned for more professional tech tips at \u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">\u003Cstrong>Superdev Academy\u003C\u002Fstrong>\u003C\u002Fspan>\u003Cspan style=\"font-style:normal;font-variant:normal;font-weight:400;text-decoration:none;vertical-align:baseline;white-space:pre-wrap;\">!\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fp>\u003Cp style=\"line-height:1.38;margin-bottom:12pt;margin-top:0pt;\" dir=\"ltr\"> \u003C\u002Fp>\u003Cdiv class=\"raw-html-embed\">\u003Cdiv style=\"margin:0 0 6px 0; font-weight:700;\">Read more:\u003C\u002Fdiv>\n\u003Cul style=\"list-style:none; padding:0; margin:0; line-height:1.4;\">\n  \u003Cli style=\"margin:0;\">\u003Ca href=\"\u002Fen\u002Fblogs\u002Fcategories\u002FGolang\" title=\"Golang The Series\">Golang The Series\u003C\u002Fa>\u003C\u002Fli>\n  \u003Cli style=\"margin:0;\">\u003Ca href=\"\u002Fen\u002Fblogs\u002Fcategories\u002FJS2GO\" title=\"JS2GO\">JS2GO\u003C\u002Fa>\u003C\u002Fli>\n  \u003Cli style=\"margin:0;\">\u003Ca href=\"\u002Fen\u002Fblogs\u002Fcategories\u002FTailwind%20CSS\" title=\"Tailwind CSS\">Tailwind CSS\u003C\u002Fa>\u003C\u002Fli>\n\u003C\u002Ful>\u003C\u002Fdiv>\u003Cp> \u003C\u002Fp>\u003Cdiv class=\"raw-html-embed\">\n  \u003Cp style=\"margin:0 0 6px 0;\">\u003Cstrong>Follow Us:\u003C\u002Fstrong>\u003C\u002Fp>\n  \u003Cul style=\"list-style:none; padding:0; margin:0; line-height: 0.4;\">\n    \u003Cli style=\"display:flex; align-items:center; gap:6px; margin:0;\">\n      \n      \u003Csvg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#1877F2\" aria-hidden=\"true\">\n        \u003Cpath d=\"M22 12.07C22 6.48 17.52 2 11.93 2S2 6.48 2 12.07c0 5 3.66 9.14 8.44 9.93v-7.02H7.9v-2.91h2.54V9.41c0-2.5 1.49-3.88 3.77-3.88 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.77-1.63 1.56v1.87h2.78l-.44 2.91h-2.34V22c4.78-.79 8.44-4.93 8.44-9.93Z\">\u003C\u002Fpath>\n      \u003C\u002Fsvg>\n      \u003Ca href=\"https:\u002F\u002Fwww.facebook.com\u002Fsuperdev.academy.th\" target=\"_blank\" rel=\"noopener\" title=\"Follow Superdev Academy on Facebook\">Facebook: Superdev Academy\u003C\u002Fa>\n    \u003C\u002Fli>\n\n    \u003Cli style=\"display:flex; align-items:center; gap:6px; margin:0;\">\n      \n      \u003Csvg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#FF0000\" aria-hidden=\"true\">\n        \u003Cpath d=\"M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.5 12 3.5 12 3.5s-7.5 0-9.4.6A3 3 0 0 0 .5 6.2 31.5 31.5 0 0 0 0 12a31.5 31.5 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.6 9.4.6 9.4.6s7.5 0 9.4-.6a3 3 0 0 0 2.1-2.1A31.5 31.5 0 0 0 24 12a31.5 31.5 0 0 0-.5-5.8ZM9.75 15.02V8.98L15.5 12l-5.75 3.02Z\">\u003C\u002Fpath>\n      \u003C\u002Fsvg>\n      \u003Ca href=\"https:\u002F\u002Fwww.youtube.com\u002F@SuperdevAcademy\" target=\"_blank\" rel=\"noopener\" title=\"Watch on YouTube\">YouTube: Superdev Academy\u003C\u002Fa>\n    \u003C\u002Fli>\n\n    \u003Cli style=\"display:flex; align-items:center; gap:6px; margin:0;\">\n      \n      \u003Csvg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#E4405F\" aria-hidden=\"true\">\n        \u003Cpath d=\"M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Zm-5 3.5A5.5 5.5 0 1 1 6.5 13 5.5 5.5 0 0 1 12 7.5Zm0 2A3.5 3.5 0 1 0 15.5 13 3.5 3.5 0 0 0 12 9.5Zm5.75-2.75a1.25 1.25 0 1 1-1.25 1.25 1.25 1.25 0 0 1 1.25-1.25Z\">\u003C\u002Fpath>\n      \u003C\u002Fsvg>\n      \u003Ca href=\"https:\u002F\u002Fwww.instagram.com\u002Fsuperdevacademy\u002F?hl=en target=\" _blank\"=\"\" rel=\"noopener\" title=\"See behind-the-scenes on Instagram\">Instagram: Superdev Academy\u003C\u002Fa>\n    \u003C\u002Fli>\n\n    \u003Cli style=\"display:flex; align-items:center; gap:6px; margin:0;\">\n      \n      \u003Csvg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#000000\" aria-hidden=\"true\">\n        \u003Cpath d=\"M21 8.12a6.86 6.86 0 0 1-4.8-2V16a6 6 0 1 1-6-6 5.9 5.9 0 0 1 1.63.23V8.05a9.08 9.08 0 0 1-1.63-.15V4.5a6.86 6.86 0 0 0 4.8 2.05V6.5a6.86 6.86 0 0 0 4.8 1.62ZM9.2 12.5A3.5 3.5 0 1 0 12.7 16V9.94a6 6 0 0 1-1.63-.27v3.95a3.5 3.5 0 0 1-1.87 3.17 3.5 3.5 0 0 1-4.78-3.23 3.5 3.5 0 0 1 4.78-3.06Z\">\u003C\u002Fpath>\n      \u003C\u002Fsvg>\n      \u003Ca href=\"https:\u002F\u002Fwww.tiktok.com\u002F@superdevacademy\" target=\"_blank\" rel=\"noopener\" title=\"Watch short tips on TikTok\">TikTok: @superdevacademy\u003C\u002Fa>\n    \u003C\u002Fli>\n\n    \u003Cli style=\"display:flex; align-items:center; gap:6px; margin:0;\">\n      \n      \u003Csvg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#111827\" aria-hidden=\"true\">\n        \u003Cpath d=\"M12 2a10 10 0 1 0 10 10A10.01 10.01 0 0 0 12 2Zm6.93 6h-3.26a15.6 15.6 0 0 0-1.39-3.62A8.03 8.03 0 0 1 18.93 8ZM12 4c.73.93 1.7 2.74 2.2 4H9.8C10.3 6.74 11.27 4.93 12 4ZM8.72 4.38A15.6 15.6 0 0 0 7.32 8H4.07a8.03 8.03 0 0 1 4.65-3.62ZM4.07 16h3.25a15.6 15.6 0 0 0 1.4 3.62A8.03 8.03 0 0 1 4.07 16ZM12 20c-.73-.93-1.7-2.74-2.2-4h4.4C13.7 17.26 12.73 19.07 12 20Zm3.28-.38A15.6 15.6 0 0 0 16.68 16h3.25a8.03 8.03 0 0 1-4.65 3.62ZM20 14h-3.54a13.8 13.8 0 0 1-.26-4H20a7.98 7.98 0 0 1 0 4Zm-12.2 0H4a7.98 7.98 0 0 1 0-4h3.54a13.8 13.8 0 0 1-.26 4Zm2 .5h4.4a17.8 17.8 0 0 1-.72-4.5c0-1.58.25-3.1.72-4.5H9.8a17.8 17.8 0 0 1 .72 4.5c0 1.58-.25 3.1-.72 4.5Z\">\u003C\u002Fpath>\n      \u003C\u002Fsvg>\n      \u003Ca href=\"https:\u002F\u002Fwww.superdevacademy.com\u002F\" target=\"_blank\" rel=\"noopener\" title=\"Visit the official website of Superdev Academy\">Official Website: Superdev Academy.com\u003C\u002Fa>\n    \u003C\u002Fli>\n  \u003C\u002Ful>\n\u003C\u002Fdiv>","cover_image_how_to_use_cloudflare_tunnel_to_expose_localhost_without_port_forwarding_3ltp5dhqn6.webp","https:\u002F\u002Ftwsme-r2.tumwebsme.com\u002Fsclblg987654321\u002Fbm8dllzwthuvdi5\u002Fcover_image_how_to_use_cloudflare_tunnel_to_expose_localhost_without_port_forwarding_3ltp5dhqn6.webp","2026-03-04 08:44:18.025Z","",{"keywords":15,"locale":38,"school_blog":48},[16,23,28,33],{"collectionId":17,"collectionName":18,"created":19,"created_by":13,"id":20,"name":21,"updated":22,"updated_by":13},"sclkey987654321","school_keywords","2026-03-04 08:44:16.622Z","7k1sal58dnj3ycv","Cloudflare Zero Trust","2026-04-10 16:12:42.473Z",{"collectionId":17,"collectionName":18,"created":24,"created_by":13,"id":25,"name":26,"updated":27,"updated_by":13},"2026-03-04 08:44:16.902Z","1pf59ie7wale4so","Localhost","2026-04-10 16:12:42.539Z",{"collectionId":17,"collectionName":18,"created":29,"created_by":13,"id":30,"name":31,"updated":32,"updated_by":13},"2026-03-04 08:44:17.506Z","2hw2c6o2elosloo","Cloudflare Tunnel","2026-04-10 16:12:42.786Z",{"collectionId":17,"collectionName":18,"created":34,"created_by":13,"id":35,"name":36,"updated":37,"updated_by":13},"2026-03-04 08:44:17.746Z","il984gdus3ha65e","how to use cloudflare tunnel","2026-04-10 16:12:42.923Z",{"code":39,"collectionId":40,"collectionName":41,"created":42,"flag":43,"id":44,"is_default":45,"label":46,"updated":47},"en","pbc_1989393366","locales","2026-01-22 11:00:02.726Z","twemoji:flag-united-states","qv9c1llfov2d88z",false,"English","2026-04-10 15:42:46.825Z",{"category":49,"collectionId":50,"collectionName":51,"created":13,"expand":52,"id":66,"slug":67,"updated":68,"views":69},"rfxf19ot4iq992c","pbc_2105096300","school_blogs",{"category":53},{"blogIds":54,"collectionId":55,"collectionName":56,"created":57,"created_by":13,"id":49,"image":58,"image_alt":13,"image_path":59,"label":60,"name":61,"priority":62,"publish_at":63,"scheduled_at":13,"status":64,"updated":65,"updated_by":13},[],"sclcatblg987654321","school_category_blogs","2026-03-04 08:32:03.969Z","7acfigk1qkd_lv1k6bkji3.png","https:\u002F\u002Ftwsme-r2.tumwebsme.com\u002Fsclcatblg987654321\u002Frfxf19ot4iq992c\u002F7acfigk1qkd_lv1k6bkji3.png",{"en":61,"th":61},"Web Development",0,"2025-01-21 03:43:00.282Z","published","2026-04-25 02:32:14.918Z","98jiz88lg5ihh7t","how-to-use-cloudflare-tunnel-localhost","2026-05-11 13:48:23.385Z",208,"bm8dllzwthuvdi5",[20,25,30,35],"2026-02-19 02:03:40.665Z","Learn how to use Cloudflare Tunnel to expose your localhost project to the internet securely. No port forwarding or public IP required. The ultimate guide for developers.","2026-05-08 06:51:47.112Z",1,{"th":67,"en":67}]