← ImageKit.io

Upload Image with ImageKit.io API

Pipedream makes it easy to connect APIs for ImageKit.io and 2,000+ other apps remarkably fast.

Trigger workflow on
HTTP requests, schedules and app events
Next, do this
Upload Image with the ImageKit.io API
No credit card required
Intro to Pipedream
Watch us build a workflow
Watch us build a workflow
4 min
Watch now ➜

Trusted by 800,000+ developers from startups to Fortune 500 companies

Adyen logo
Appcues logo
Bandwidth logo
Checkr logo
ChartMogul logo
Dataminr logo
Gopuff logo
Gorgias logo
LinkedIn logo
Logitech logo
Replicated logo
Rudderstack logo
SAS logo
Scale AI logo
Webflow logo
Warner Bros. logo
Adyen logo
Appcues logo
Bandwidth logo
Checkr logo
ChartMogul logo
Dataminr logo
Gopuff logo
Gorgias logo
LinkedIn logo
Logitech logo
Replicated logo
Rudderstack logo
SAS logo
Scale AI logo
Webflow logo
Warner Bros. logo

Developers Pipedream

Getting Started

Create a workflow to Upload Image with the ImageKit.io API. When you configure and deploy the workflow, it will run on Pipedream's servers 24x7 for free.

  1. Configure the Upload Image action
    1. Connect your ImageKit.io account
    2. Configure File
    3. Configure File Name
    4. Optional- Configure Use Unique Filename
    5. Optional- Configure Tags
    6. Optional- Configure Folder
    7. Optional- Configure Is Private File
    8. Optional- Configure Is Published
    9. Optional- Configure Custom Coordinates
    10. Optional- Configure Response Fields
    11. Optional- Configure Extensions
    12. Optional- Configure Webhook URL
    13. Optional- Configure Overwrite File
    14. Optional- Configure Overwrite AI Tags
    15. Optional- Configure Overwrite Custom Metadata
    16. Optional- Configure customMetadata
  2. Select a trigger to run your workflow on HTTP requests, schedules or app events
  3. Deploy the workflow
  4. Send a test event to validate your setup
  5. Turn on the trigger

Integrations

Upload Image with ImageKit.io API on New Requests (Payload Only) from HTTP / Webhook API
HTTP / Webhook + ImageKit.io
 
Try it
Upload Image with ImageKit.io API on New Submission from Typeform API
Typeform + ImageKit.io
 
Try it
Upload Image with ImageKit.io API on Custom Events from Zoom API
Zoom + ImageKit.io
 
Try it
Upload Image with ImageKit.io API on New Submission (Instant) from Jotform API
Jotform + ImageKit.io
 
Try it
Upload Image with ImageKit.io API on New Scheduled Tasks from Pipedream API
Pipedream + ImageKit.io
 
Try it

Details

This is a pre-built, source-available component from Pipedream's GitHub repo. The component is developed by Pipedream and the community, and verified and maintained by Pipedream.

To contribute an update to an existing component or create a new component, create a PR on GitHub. If you're new to Pipedream component development, you can start with quickstarts for trigger span and action development, and then review the component API reference.

Upload Image on ImageKit.io
Description:Upload a new image to ImageKit.io. [See the documentation](https://docs.imagekit.io/api-reference/upload-file-api/server-side-file-upload)
Version:0.0.2
Key:imagekit_io-upload-image

Code

import {
  fieldToString,
  getFileFormData,
} from "../../common/methods.mjs";
import imagekitIo from "../../imagekit_io.app.mjs";

export default {
  key: "imagekit_io-upload-image",
  name: "Upload Image",
  version: "0.0.2",
  description: "Upload a new image to ImageKit.io. [See the documentation](https://docs.imagekit.io/api-reference/upload-file-api/server-side-file-upload)",
  type: "action",
  props: {
    imagekitIo,
    file: {
      type: "string",
      label: "File",
      description: "The file you want to upload. It can be **binnary**, **base64** or **url** or **a file path in the `/tmp` directory.** [See the documentation on working with files](https://pipedream.com/docs/code/nodejs/working-with-files/).",
    },
    fileName: {
      type: "string",
      label: "File Name",
      description: "The name with which the file has to be uploaded. The file name can contain: - Alphanumeric Characters: **a-z , A-Z , 0-9** (including unicode letters, marks, and numerals in other languages) - Special Characters: **.** and **-** Any other character including space will be replaced by **_**",
    },
    useUniqueFileName: {
      type: "boolean",
      label: "Use Unique Filename",
      description: "Whether to use a unique filename for this file or not. If set **true**, ImageKit.io will add a unique suffix to the filename parameter to get a unique filename. If set **false**, then the image is uploaded with the provided filename parameter, and any existing file with the same name is replaced. Default Value is **True**",
      optional: true,
    },
    tags: {
      type: "string[]",
      label: "Tags",
      description: "Set the tags while uploading the file. `%` is not allowed. If this field is not specified and the file is overwritten then the tags will be removed.",
      optional: true,
    },
    folder: {
      type: "string",
      label: "Folder",
      description: "The folder path **(e.g. /images/folder/)** in which the image has to be uploaded. If the folder(s) didn't exist before, a new folder(s) is created. The nesting of folders can be at most 50 levels deep. The folder name can contain: - Alphanumeric Characters: **a-z , A-Z , 0-9** (including unicode letters, marks, and numerals in other languages). - Special Characters: **/**, **_** and **-**. - Using multiple / creates a nested folder.",
      optional: true,
    },
    isPrivateFile: {
      type: "boolean",
      label: "Is Private File",
      description: "Whether to mark the file as private or not. This is only relevant for image type files.",
      optional: true,
    },
    isPublished: {
      type: "boolean",
      label: "Is Published",
      description: "Whether to upload file as published or not. If set **false**, the file is marked as unpublished, which restricts access to the file only via the media library. Files in [draft or unpublished](https://docs.imagekit.io/media-library/overview/draft-assets) state can only be publicly accessed after being published. - The option to upload in draft state is only available in custom enterprise pricing plans.",
      optional: true,
    },
    customCoordinates: {
      type: "string",
      label: "Custom Coordinates",
      description: "Define an important area in the image. This is only relevant for image type files. The the format **x,y,width,height**. For example - **10,10,100,100**.",
      optional: true,
    },
    responseFields: {
      type: "string[]",
      label: "Response Fields",
      description: "A list of the fields that you want the API to return in the response. For example, set the value of this field to **tags**, **customCoordinates**, **isPrivateFile** to get the value of **tags**, **customCoordinates**, **isPublished** and **isPrivateFile** in the response. Accepts combination of **tags**, **customCoordinates**, **isPrivateFile**, **embeddedMetadata**, **customMetadata**, and **metadata**.",
      optional: true,
    },
    extensions: {
      type: "string[]",
      label: "Extensions",
      description: "An array of stringified object extensions to be applied to the image. For reference about extensions [read here](https://docs.imagekit.io/extensions/overview).",
      optional: true,
    },
    webhookUrl: {
      type: "string",
      label: "Webhook URL",
      description: "The final status of pending extensions will be sent to this URL. To learn more about how ImageKit uses webhooks, [refer here](https://docs.imagekit.io/extensions/overview#webhooks).",
      optional: true,
    },
    overwriteFile: {
      type: "boolean",
      label: "Overwrite File",
      description: "Default is **true**. If **overwriteFile** is set to **false** and **useUniqueFileName** is also **false**, and a file already exists at the exact location, upload API will return an error immediately.",
      optional: true,
    },
    overwriteAITags: {
      type: "boolean",
      label: "Overwrite AI Tags",
      description: "Default is **true**. If the request does not have **tags**, **overwriteTags** is set to **true** and a file already exists at the exact location, exiting **tags** will be removed. In case the request body has **tags**, setting **overwriteTags** to **false** has no effect and request's **tags** are set on the asset.",
      optional: true,
    },
    overwriteCustomMetadata: {
      type: "boolean",
      label: "Overwrite Custom Metadata",
      description: "Default is **true**. If the request does not have **customMetadata**, **overwriteCustomMetadata** is set to **true** and a file already exists at the exact location, exiting **customMetadata** will be removed. In case the request body has **customMetadata**, setting **overwriteCustomMetadata** to **false** has no effect and request's **customMetadata** is set on the asset.",
      optional: true,
    },
    customMetadata: {
      type: "object",
      label: "customMetadata",
      description: "A JSON key-value data to be associated with the asset. Checkout **overwriteCustomMetadata** parameter to understand default behaviour. Before setting any custom metadata on an asset you have to create the field using [custom metadata fields API](https://docs.imagekit.io/api-reference/custom-metadata-fields-api).",
      optional: true,
    },
  },
  async run({ $ }) {
    const {
      imagekitIo,
      file,
      customMetadata,
      extensions,
      ...appendData
    } = this;

    const data = getFileFormData(file);

    let newExt = extensions;

    if (Array.isArray(newExt)) {
      newExt = newExt.map((item) => {
        if (typeof item === "object") {
          return JSON.stringify(item);
        }
        return item;
      });

      newExt = `[${newExt.toString()}]`;
    }

    data.append("extensions", newExt);

    for (const [
      label,
      value,
    ] of Object.entries(appendData)) {
      data.append(label, value.toString());
    }

    if (customMetadata) {
      data.append("customMetadata", fieldToString(customMetadata));
    }

    const response = await imagekitIo.uploadImage({
      $,
      headers: {
        ...data.getHeaders(),
      },
      data,
    });

    $.export("$summary", `The file with Id: ${response.fileId} was successfully uploaded!`);
    return response;
  },
};

Configuration

This component may be configured based on the props defined in the component code. Pipedream automatically prompts for input values in the UI and CLI.
LabelPropTypeDescription
ImageKit.ioimagekitIoappThis component uses the ImageKit.io app.
Filefilestring

The file you want to upload. It can be binnary, base64 or url or a file path in the /tmp directory. See the documentation on working with files.

File NamefileNamestring

The name with which the file has to be uploaded. The file name can contain: - Alphanumeric Characters: a-z , A-Z , 0-9 (including unicode letters, marks, and numerals in other languages) - Special Characters: . and - Any other character including space will be replaced by _

Use Unique FilenameuseUniqueFileNameboolean

Whether to use a unique filename for this file or not. If set true, ImageKit.io will add a unique suffix to the filename parameter to get a unique filename. If set false, then the image is uploaded with the provided filename parameter, and any existing file with the same name is replaced. Default Value is True

Tagstagsstring[]

Set the tags while uploading the file. % is not allowed. If this field is not specified and the file is overwritten then the tags will be removed.

Folderfolderstring

The folder path (e.g. /images/folder/) in which the image has to be uploaded. If the folder(s) didn't exist before, a new folder(s) is created. The nesting of folders can be at most 50 levels deep. The folder name can contain: - Alphanumeric Characters: a-z , A-Z , 0-9 (including unicode letters, marks, and numerals in other languages). - Special Characters: /, _ and -. - Using multiple / creates a nested folder.

Is Private FileisPrivateFileboolean

Whether to mark the file as private or not. This is only relevant for image type files.

Is PublishedisPublishedboolean

Whether to upload file as published or not. If set false, the file is marked as unpublished, which restricts access to the file only via the media library. Files in draft or unpublished state can only be publicly accessed after being published. - The option to upload in draft state is only available in custom enterprise pricing plans.

Custom CoordinatescustomCoordinatesstring

Define an important area in the image. This is only relevant for image type files. The the format x,y,width,height. For example - 10,10,100,100.

Response FieldsresponseFieldsstring[]

A list of the fields that you want the API to return in the response. For example, set the value of this field to tags, customCoordinates, isPrivateFile to get the value of tags, customCoordinates, isPublished and isPrivateFile in the response. Accepts combination of tags, customCoordinates, isPrivateFile, embeddedMetadata, customMetadata, and metadata.

Extensionsextensionsstring[]

An array of stringified object extensions to be applied to the image. For reference about extensions read here.

Webhook URLwebhookUrlstring

The final status of pending extensions will be sent to this URL. To learn more about how ImageKit uses webhooks, refer here.

Overwrite FileoverwriteFileboolean

Default is true. If overwriteFile is set to false and useUniqueFileName is also false, and a file already exists at the exact location, upload API will return an error immediately.

Overwrite AI TagsoverwriteAITagsboolean

Default is true. If the request does not have tags, overwriteTags is set to true and a file already exists at the exact location, exiting tags will be removed. In case the request body has tags, setting overwriteTags to false has no effect and request's tags are set on the asset.

Overwrite Custom MetadataoverwriteCustomMetadataboolean

Default is true. If the request does not have customMetadata, overwriteCustomMetadata is set to true and a file already exists at the exact location, exiting customMetadata will be removed. In case the request body has customMetadata, setting overwriteCustomMetadata to false has no effect and request's customMetadata is set on the asset.

customMetadatacustomMetadataobject

A JSON key-value data to be associated with the asset. Checkout overwriteCustomMetadata parameter to understand default behaviour. Before setting any custom metadata on an asset you have to create the field using custom metadata fields API.

Authentication

ImageKit.io uses API keys for authentication. When you connect your ImageKit.io account, Pipedream securely stores the keys so you can easily authenticate to ImageKit.io APIs in both code and no-code steps.

To retrieve your Private Key,

  • Navigate to your ImageKit.io account and sign in
  • Go to “DEVELOPER” > “Developer options”
  • Copy your Private Key from the API keys section

About ImageKit.io

Media management, optimization, and delivery solution for a seamless visual experience on websites and apps.

More Ways to Use ImageKit.io

Actions

Get File Details with the ImageKit.io API

Get details from a specific file. See the documentation

 
Try it
Search Files with the ImageKit.io API

List all the uploaded files and folders in your ImageKit.io media library. See the documentation

 
Try it

Explore Other Apps

1
-
24
of
2,000+
apps by most popular

HTTP / Webhook
HTTP / Webhook
Get a unique URL where you can send HTTP or webhook requests
Node
Node
Anything you can do with Node.js, you can do in a Pipedream workflow. This includes using most of npm's 400,000+ packages.
Python
Python
Anything you can do in Python can be done in a Pipedream Workflow. This includes using any of the 350,000+ PyPi packages available in your Python powered workflows.
OpenAI (ChatGPT)
OpenAI (ChatGPT)
OpenAI is an AI research and deployment company with the mission to ensure that artificial general intelligence benefits all of humanity. They are the makers of popular models like ChatGPT, DALL-E, and Whisper.
Salesforce (REST API)
Salesforce (REST API)
Web services API for interacting with Salesforce
HubSpot
HubSpot
HubSpot's CRM platform contains the marketing, sales, service, operations, and website-building software you need to grow your business.
Zoho CRM
Zoho CRM
Zoho CRM is an online Sales CRM software that manages your sales, marketing, and support in one CRM platform.
Stripe
Stripe
Stripe powers online and in-person payment processing and financial solutions for businesses of all sizes.
Shopify Developer App
Shopify Developer App
Shopify is a user-friendly e-commerce platform that helps small businesses build an online store and sell online through one streamlined dashboard.
WooCommerce
WooCommerce
WooCommerce is the open-source ecommerce platform for WordPress.
Snowflake
Snowflake
A data warehouse built for the cloud
MongoDB
MongoDB
MongoDB is an open source NoSQL database management program.
Supabase
Supabase
Supabase is an open source Firebase alternative.
MySQL
MySQL
MySQL is an open-source relational database management system.
PostgreSQL
PostgreSQL
PostgreSQL is a free and open-source relational database management system emphasizing extensibility and SQL compliance.
AWS
AWS
Amazon Web Services (AWS) offers reliable, scalable, and inexpensive cloud computing services.
Twilio SendGrid
Twilio SendGrid
Send marketing and transactional email through the Twilio SendGrid platform with the Email API, proprietary mail transfer agent, and infrastructure for scalable delivery.
Amazon SES
Amazon SES
Amazon SES is a cloud-based email service provider that can integrate into any application for high volume email automation
Klaviyo
Klaviyo
Email Marketing and SMS Marketing Platform
Zendesk
Zendesk
Zendesk is award-winning customer service software trusted by 200K+ customers. Make customers happy via text, mobile, phone, email, live chat, social media.
ServiceNow
ServiceNow
The smarter way to workflow
Notion
Notion
Notion is a new tool that blends your everyday work apps into one. It's the all-in-one workspace for you and your team.
Slack
Slack
Slack is a channel-based messaging platform. With Slack, people can work together more effectively, connect all their software tools and services, and find the information they need to do their best work — all within a secure, enterprise-grade environment.
Microsoft Teams
Microsoft Teams
Microsoft Teams has communities, events, chats, channels, meetings, storage, tasks, and calendars in one place.