Strapi 5 FTP Upload Provider

This is a Strapi 5 provider plugin that allows you to upload media files via FTP. For better organization, it will automatically create year and month folders inside your FTP server.

Features

• Uploads media files to an FTP server.

• Automatically creates year and month directories for file organization:

  • 2024
    • 01 (January)
    • 02 (February)
  • 2025
    • 01 (January)
    • 02 (February)

• Allows you to set a custom path for organizing files on your FTP server (optional).

Why Use an FTP Provider?

• Simple to Set Up: FTP is easy to configure and widely supported by most web hosts.
• No Bandwidth Limits: Unlike cloud services that charge based on storage and data transfer, FTP typically offers unlimited bandwidth (depending on your hosting plan).
• Custom Domain: You can use your own domain (e.g., images.yourwebsite.com) to serve media, enhancing your branding and control.
• Cloudflare Integration: Easily put Cloudflare in front of your FTP server to improve security, performance, and caching for faster delivery of media.

Installation

To install this plugin in your Strapi project, run the following command:

npm install strapi5-provider-upload-ftp --save

Configuration

After installing the plugin, you need to configure it in the config/plugins.js file. If this file doesn't already exist, create it. This file should contain the following information:

1module.exports = ({ env }) => ({
2  upload: {
3    config: {
4      provider: 'strapi5-provider-upload-ftp',
5      providerOptions: {
6        host: env('FTP_HOST'),
7        port: env.int('FTP_PORT', 21),
8        user: env('FTP_USER'),
9        password: env('FTP_PASSWORD'),
10        publicUrl: env('FTP_PUBLIC_URL'),
11        ftp_custom_path: env('FTP_CUSTOM_PATH', ''),
12        secure: env.bool('FTP_SECURE', false),
13        passive: env.bool('FTP_PASSIVE', true),
14      },
15    },
16  },
17});

Security Middleware Configuration

Because of Strapi's default security settings, you need to change the contentSecurityPolicy configuration to properly view thumbnails in the Media Library. Instead of using the strapi::security setting, replace it with the object below, as described in the middleware configuration.

1export default [
2  'strapi::logger',
3  'strapi::errors',
4  {
5    name: 'strapi::security',
6    config: {
7      contentSecurityPolicy: {
8        useDefaults: true,
9        directives: {
10          'connect-src': ["'self'", 'https:'],
11          'img-src': [
12            "'self'",
13            'data:',
14            'blob:',
15            'yourwebsite.com',
16          ],
17          'media-src': [
18            "'self'",
19            'data:',
20            'blob:',
21            'yourwebsite.com',
22          ],
23          upgradeInsecureRequests: null,
24        },
25      },
26    },
27  },
28  'strapi::cors',
29  'strapi::poweredBy',
30  'strapi::query',
31  'strapi::body',
32  'strapi::session',
33  'strapi::favicon',
34  'strapi::public',
35];

Environment Variables

You will also need to create a .env file with the following information (replace the values with your own FTP credentials):

1FTP_HOST=ftp.yourserver.com
2FTP_PORT=21
3FTP_USER=your-ftp-username
4FTP_PASSWORD=your-ftp-password
5FTP_PUBLIC_URL=https://yourwebsite.com
6FTP_CUSTOM_PATH=uploads/images # Optional: Set a custom folder path
7FTP_SECURE=false # Set to true if you want to use FTPS (FTP over SSL/TLS)
8FTP_PASSIVE=true # Use passive mode (recommended for most firewalls)

Testing

The plugin has been tested and works with Strapi v5.4.1 and Node.js v20.15.1.