If you’ve ever built a Flutter web app, you’ve probably run into one annoying issue: CORS errors during development.

Traditionally, fixing this meant tweaking backend headers, setting up a reverse proxy (like Nginx), or using messy workarounds like disabling web security in Chrome.

But Flutter recently introduced a game-changer that simplifies all of this: A built-in web development proxy.

It’s one of those small features that makes a huge difference in your daily workflow.

What Is Flutter’s Web Dev Proxy?

The Flutter SDK now allows you to define a local proxy using a simple configuration file: web_dev_config.yaml.

This allows your Flutter web app to forward API requests to your backend automatically, bypassing CORS restrictions because the browser sees the requests as coming from the same origin as your app.

My Setup

Here’s the configuration I’m using for my projects:

server:
  host: "0.0.0.0"
  port: 8000

  proxy:
    - target: "https://your-api-endpoint.com"
      prefix: "/api/"

    - target: "https://your-storage-endpoint.com"
      prefix: "/files/"

How It Works

With this setup:

• Requests to /api/... → forwarded to your backend target.
• Requests to /files/... → forwarded to your file server target.

In your Flutter code, instead of hardcoding the full URL, you can simply write:

final response = await http.get(Uri.parse('/api/users'));

Flutter internally forwards this to https://your-api-endpoint.com/api/users. No CORS issues. No extra setup. No headache.

Why This Is a Big Deal

1. No More CORS Configuration

You don’t need to enable CORS on your backend during development, install middleware, or debug frustrating browser errors.

2. Seamless Integration

It feels native and works exactly like proxying in Webpack or Vite, but built directly into the Flutter toolchain.

3. No External Proxy Needed

Previously, developers relied on Nginx, local proxy servers, or custom scripts. Flutter now handles it out of the box.

Optional: HTTPS Support

If you need to test secure environments locally (e.g., for location services or secure cookies), you can even enable HTTPS:

https:
  cert-path: "/path/to/cert.pem"
  cert-key-path: "/path/to/key.pem"

Conclusion

If you’re building Flutter web apps, this is a must-have in your workflow. Just create a web_dev_config.yaml in your project root, define your proxy rules, and run your app.

Happy coding!

Shamnad Sherief - Product Engineer