Skip to content

README.md

Latest commit

 

History

History
150 lines (120 loc) · 5.19 KB

README.md

File metadata and controls

150 lines (120 loc) · 5.19 KB

How to run locally

This project is developed using node version 18.

Setup environment variables

Create a .env, file and add below parameters:

# Server
HOST=0.0.0.0
PORT=1337

# Secrets
APP_KEYS="toBeModified1,toBeModified2"
API_TOKEN_SALT=tobemodified
ADMIN_JWT_SECRET=tobemodified
TRANSFER_TOKEN_SALT=tobemodified

# Database
DATABASE_CLIENT=sqlite
DATABASE_HOST=
DATABASE_PORT=
DATABASE_NAME=
DATABASE_USERNAME=
DATABASE_PASSWORD=
DATABASE_SSL=false
DATABASE_FILENAME=.tmp/data.db
JWT_SECRET=tobemodified

PUBLIC_KEY = <YOUR_IMAGEKIT_PUBLIC_KEY>
URL_ENDPOINT = <YOUR_IMAGEKIT_URL_ENDPOINT>
PRIVATE_KEY = <YOUR_IMAGEKIT_PRIVATE_KEY>

You can get the value of URL_ENDPOINT from your ImageKit dashboard. PUBLIC_KEY and PRIVATE_KEY can be obtained from the developer section in your ImageKit dashboard.

Install packages:

npm install

Run the app

npm run develop

The app will run at http://localhost:1337/admin, and it will ask you to register as the first local administrator. Once done, You now have access to the admin panel.

Configuration

To make our provider work, we need to add a configuration in the ./config/plugins.js file. The configuration should include the following parameters, as described below.

  • provider: Specifies the name of the provider.
  • providerOptions: Contains the options required to configure the provider.
    • urlEndpoint: A required parameter that can be obtained from the URL-endpoint section or the developer section on your ImageKit dashboard.
    • publicKey and privateKey: Required parameters that can be retrieved from the developer section on your ImageKit dashboard.
    • uploadOptions is an optional parameter that accepts upload parameters supported by the ImageKit Upload API. The following parameters are supported by the provider: folder, useUniqueFileName, tags, checks, isPrivateFile, customCoordinates, webhookUrl, extensions, transformation, and customMetadata.

For more information about using a provider, refer to the documentation about using a provider. To understand how environment variables are used in Strapi, please refer to the documentation about environment variables.

Provider Configuration

Below is an example of how to configure the provider in ./config/plugins.js.

module.exports = ({ env }) => ({
  // ...
  upload: {
    config: {
      provider: "strapi-provider-upload-imagekitio",
      providerOptions: {
        publicKey: env("PUBLIC_KEY"),
        privateKey: env("PRIVATE_KEY"),
        urlEndpoint: env("URL_ENDPOINT"),

        // Optional
        uploadOptions: {
          folder: "/path",
          useUniqueFileName: true,
          tags: ["tag1", "tag2"],
          checks: `"file.size" < "1mb"`,
          isPrivateFile: false,
          customCoordinates: "1,2,3,4",
          webhookUrl: "https://testwebook.com",
          extensions: [
          {
              name: "google-auto-tagging",
              maxTags: 5,
              minConfidence: 95,
          },
          ],
          transformation: {
          pre: "l-text,i-Imagekit,fs-50,l-end",
          post: [
              {
              type: "transformation",
              value: "l-text,i-Imagekit,fs-50,l-end",
              },
          ],
          },
          customMetadata: { test: "value" },
        },
      },
    },
  },
  // ...
});

Note: Ensure that the custom metadata test is already created in the Media Library Settings.

Security Middleware Configuration

The default settings in Strapi's Security Middleware require modifications to the contentSecurityPolicy settings to ensure thumbnail previews are visible in the Media Library. Replace the strapi::security string with the object provided below, as detailed in the middleware configuration documentation.

./config/middlewares.js

module.exports = [
  // ...
  {
    name: 'strapi::security',
    config: {
      contentSecurityPolicy: {
        useDefaults: true,
        directives: {
          'connect-src': ["'self'", 'https:'],
          'img-src': ["'self'", 'data:', 'blob:', 'ik.imagekit.io'],
          'media-src': ["'self'", 'data:', 'blob:', 'ik.imagekit.io'],
          upgradeInsecureRequests: null,
        },
      },
    },
  },
  // ...
];

Useful links

Report a bug

If something doesn't work as expected, report a bug at support@imagekit.io.