How to Embed a Localhost Web Page in PowerPoint

Summary

You can embed and interact with a local web development server (localhost or 127.0.0.1) directly inside PowerPoint by exposing it through a secure Cloudflare Tunnel and loading the generated HTTPS address into Web Viewer 2.0. Present live dashboards, prototypes, and internal tools without switching windows.

Direct local addresses like http://localhost:8080 fail inside Office add-ins due to browser security restrictions, while free ngrok tunnels stall on an anti-phishing interstitial. Follow the four steps below to launch a quick Cloudflare Tunnel and embed your local site into PowerPoint.

Before you start

• Open a PowerPoint presentation with Web Viewer 2.0 already inserted on the slide.
• Resize Web Viewer to fill the slide, with its edges aligned to the slide's edges.
• Start your local web application in a terminal (for example, on http://localhost:8080).
• Open a second terminal window to run cloudflared via npx or the Cloudflare CLI.

Embed your local site with Cloudflare Tunnel

1. Open your terminal and run cloudflared pointing to your local port:

npx cloudflared tunnel --url http://localhost:8080

Cloudflare creates a temporary tunnel on trycloudflare.com without requiring an account or authentication token. Locate the generated public HTTPS URL in your terminal output.

2. In PowerPoint, click the www button at the top left of Web Viewer. Its tooltip is Loads a web page from a URL.

3. Paste the trycloudflare.com address into URL (1), then click Load (2).

4. Once your local page loads, click Present in PowerPoint to interact with your application live during Slide Show.

Comparing localhost embedding methods

The table below compares the three primary approaches developers use to test local pages inside PowerPoint:

Why free ngrok fails in Web Viewer

ngrok provides public HTTPS tunnels, but its free tier fails inside Web Viewer due to two cascading browser restrictions:

• Anti-phishing interstitial screen:
  • ngrok pauses visitors on an interstitial warning page (“You are about to visit...”).
  • Bypassing this page requires clicking Visit Site to set an authorization cookie.
• Third-party cookie blocking:
  • Web Viewer runs your site inside an <iframe> within PowerPoint.
  • Modern browsers block cross-origin third-party cookies inside iframes.
  • The bypass cookie never saves, ngrok loops the warning screen, and your app never renders.

Why direct localhost addresses fail

Three browser security standards block direct local addresses in Office add-ins:

• Mixed Content restrictions:
  • Office add-ins run over secure HTTPS parent frames.
  • Browsers prohibit HTTPS parent pages from embedding insecure plaintext http:// iframes.
• Local Network Access (LNA) protections:
  • Chromium engines (Google Chrome and Microsoft Edge) restrict public web contexts from querying loopback IP addresses (127.0.0.1).
  • Browsers block internal network calls unless the local server grants explicit preflight permission.
• Untrusted certificate rejection in iframes:
  • Local HTTPS servers rely on self-signed certificates.
  • Standalone browser tabs offer an interactive “Proceed anyway” button, but browsers reject untrusted certificates inside an <iframe> immediately without displaying a bypass prompt.

Local server configuration checklist

Before your presentation, verify your local application headers and terminal session:

• Frame permission headers:
  • Remove X-Frame-Options: DENY or X-Frame-Options: SAMEORIGIN response headers.
  • If you enforce Content Security Policy (CSP), configure Content-Security-Policy: frame-ancestors * or include your Office domain.
  • See our guide on why some websites cannot load in Web Viewer.
• Terminal liveness:
  • Cloudflare Tunnel forwards traffic only while npx cloudflared runs.
  • Keep the tunnel terminal window open alongside your dev server throughout your demo.
• Session cleanup:
  • Press Ctrl + C in the tunnel terminal when your presentation ends to close the public gateway.

FAQ

Does Cloudflare Quick Tunnel require an account or credit card?

No. Running npx cloudflared tunnel --url http://localhost:8080 creates a temporary tunnel on trycloudflare.com without any account registration, payment, or configuration files.

Can I interact with my local application during Slide Show?

Yes. Web Viewer 2.0 maintains a live browser session inside PowerPoint. Buttons, form inputs, dropdowns, and WebSocket connections continue to function during your presentation.

Can my organization deploy Web Viewer for internal demos?

Yes. See Web Viewer plans and licensing. If your organization manages Microsoft 365 add-in access centrally, an administrator can deploy Web Viewer through the Microsoft 365 admin center.

Need help?

Still stuck? Contact Web Viewer support and we will help you get your site running.