Building public APIs is common in modern web applications. Whether you're displaying products, blogs, users, or public content, your frontend often needs to fetch data from an API.

One question many developers ask is:

“How do I hide my API from the browser Network tab?”

The short answer is:

You cannot completely hide a public API from browser developer tools.

If the browser needs the data to display your page, the request and response will always be visible in the Network tab.

However, you can secure and protect your API from misuse, abuse, scraping, and attacks.

In this blog, we’ll explore professional ways to secure public APIs using Node.js and Express.

Why APIs Appear in the Network Tab

Suppose your frontend makes a request like this:

fetch('/api/products')

The browser sends an HTTP request to your server to retrieve the data.

Because the browser is involved, users can inspect:

• API URLs
• Request headers
• Response data
• Payloads

This is completely normal and happens in every major website and application.

Even platforms like:

• Facebook
• Instagram
• Netflix

show API requests inside browser developer tools.

The real goal is not to hide APIs, but to secure them properly.

1. Use Helmet for Security Headers

One of the first steps in securing an Express application is using Helmet.

Install it:

npm install helmet

Usage:

const helmet = require('helmet');

app.use(helmet());

Helmet adds important HTTP security headers that help protect against:

• Clickjacking
• MIME-type sniffing
• Cross-site scripting attacks
• Information leakage

2. Add Rate Limiting

Public APIs are vulnerable to:

• Spam requests
• Bots
• Brute-force attacks
• API abuse

Using express-rate-limit helps control excessive traffic.

Install:

npm install express-rate-limit

Example:

const rateLimit = require('express-rate-limit');

app.use(rateLimit({
  windowMs: 15 * 60 * 1000,
  max: 100
}));

This limits users to:

• 100 requests
• every 15 minutes
• per IP address

3. Restrict API Access with CORS

Even public APIs should restrict which domains can access them from browsers.

Install CORS:

npm install cors

Example configuration:

const cors = require('cors');

app.use(cors({
  origin: ['https://yourdomain.com']
}));

This allows only your frontend domain to access the API from browsers.

Important note:

• CORS protects browser-based requests
• It does not stop Postman or server-side scripts

4. Never Return Sensitive Data

One of the biggest mistakes developers make is exposing unnecessary database fields.

Bad example:

SELECT * FROM users

Better approach:

SELECT id, name, email FROM users

Never expose:

• Passwords
• Secret tokens
• Internal admin fields
• Private user data

Always return only the data your frontend actually needs.

5. Use HTTPS Everywhere

Always use SSL certificates and HTTPS.

Correct:

https://yourdomain.com

Wrong:

http://yourdomain.com

HTTPS encrypts communication between:

• browser
• frontend
• backend

This prevents attackers from intercepting traffic.

You can use:

• Cloudflare
• Let’s Encrypt
• Hosting SSL providers

6. Hide Your Backend with Nginx Reverse Proxy

Instead of exposing your backend server directly:

http://123.45.67.89:8080

use a reverse proxy with Nginx.

Example:

server {
    server_name yourdomain.com;

    location /api/ {
        proxy_pass http://localhost:8080;
    }
}

Now users only see:

https://yourdomain.com/api

while your actual Node.js server remains hidden internally.

7. Minify and Obfuscate Frontend Code

While this does not fully hide APIs, it makes reverse engineering harder.

Production builds automatically:

• compress JavaScript
• shorten variable names
• reduce readable source code

Example:

npm run build

Modern tools like:

• Webpack
• Vite

handle this automatically.

8. Add Cloudflare Protection

Using Cloudflare adds:

• DDoS protection
• Bot filtering
• Firewall rules
• Caching
• SSL management

This significantly improves API security and performance.

9. Cache Public API Responses

For data that changes infrequently, caching reduces server load.

Example:

res.set('Cache-Control', 'public, max-age=3600');

Benefits:

• faster responses
• reduced database queries
• fewer API hits
• lower hosting costs

10. Validate All Requests on the Backend

Never trust frontend validation.

Always validate:

• request parameters
• user input
• query strings
• IDs

Example:

if (!req.query.id) {
   return res.status(400).json({
      message: 'Invalid request'
   });
}

Backend validation is essential even for public APIs.

Example Secure Public API Setup

Here’s a professional Express setup:

const express = require('express');
const helmet = require('helmet');
const cors = require('cors');
const rateLimit = require('express-rate-limit');

const app = express();

app.use(helmet());

app.use(cors({
   origin: ['https://yourdomain.com']
}));

app.use(rateLimit({
   windowMs: 15 * 60 * 1000,
   max: 100
}));

app.get('/api/products', async (req, res) => {

   const products = await db.query(
      'SELECT id, name, price FROM products'
   );

   res.json({
      status: 'success',
      data: products
   });
});

app.listen(8080, () => {
   console.log('Server running');
});

Final Thoughts

You cannot completely hide API requests from the browser Network tab if the frontend needs the data.

Instead of trying to hide APIs, focus on:

• securing your backend
• protecting sensitive data
• limiting abuse
• validating requests
• using HTTPS
• implementing rate limiting

That’s how real-world production applications are built.