Welcome to the Ultimate Guide on Fastify-Static Plugin

Fastify-Static is a powerful plugin for the Fastify framework that allows developers to serve static files with blazing speed. Whether you’re dealing with HTML, JavaScript, images, or other assets, Fastify-Static can handle them efficiently.

Basic Setup

To get started with Fastify-Static, you need to install the plugin within your Fastify application. Here’s how:

  
    // Install the plugin
    npm install fastify-static

    // Import Fastify and the plugin
    const fastify = require('fastify')();
    const path = require('path');
    const fastifyStatic = require('fastify-static');

    // Register the plugin
    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public'),
      prefix: '/public/', // optional: default '/'
    });

    // Start the server
    fastify.listen(3000, (err) => {
      if (err) throw err;
      console.log('Server listening on localhost:3000');
    });
  

Serving Multiple Directories

If you have multiple directories to serve, you can register the plugin multiple times:

  
    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public1'),
      prefix: '/public1/',
    });

    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public2'),
      prefix: '/public2/',
    });
  

Custom Headers for Your Static Files

Setting custom headers is quite straightforward. You can add a function to modify the headers:

  
    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public'),
      prefix: '/public/',
      setHeaders: (res, path, stat) => {
        res.setHeader('X-Custom-Header', 'CustomHeaderValue');
      },
    });
  

Caching and Compression

Leverage caching and compression to improve performance:

  
    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public'),
      maxAge: '1d', // 1 day
      setHeaders: (res, path, stat) => {
        res.setHeader('Cache-Control', 'public, max-age=86400'); // 1 day
      },
    });

    fastify.register(require('fastify-compress'));
  

Example App with Fastify-Static

Here’s a complete example of a simple Fastify app utilizing the Fastify-Static plugin along with some additional features:

  
    const fastify = require('fastify')();
    const path = require('path');
    const fastifyStatic = require('fastify-static');
    const fastifyCompress = require('fastify-compress');

    fastify.register(fastifyCompress);

    fastify.register(fastifyStatic, {
      root: path.join(__dirname, 'public'),
      prefix: '/public/',
      setHeaders: (res, path, stat) => {
        res.setHeader('Cache-Control', 'public, max-age=86400');
      },
    });

    fastify.get('/', (req, reply) => {
      reply.sendFile('index.html'); // serving public/index.html directly
    });

    fastify.listen(3000, (err) => {
      if (err) throw err;
      console.log('Server listening on localhost:3000');
    });
  

In this example, we serve files from the ‘public’ directory, with custom headers and compression for improved performance. We also have a route to serve the homepage directly.

Conclusion

Fastify-Static is a highly efficient way to serve static files in your Fastify application. With features like custom headers, multi-directory support, and easy integration with other Fastify plugins, it provides a robust solution for static file serving needs.

Hash: 56525e2daeb36ece47b9d872e7a6d4f32e24282fc36404897ee1a20b50e406af