support imagekit as image storage

addozhang · Feb 18, 2024 · 8baa6f7 · 8baa6f7
1 parent f3d3a4d
commit 8baa6f7
Show file tree

Hide file tree

Showing 9 changed files with 105 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 # Obsidian Image Upload Toolkit
 
 This plugin cloud upload all local images embedded in markdown to specified remote image store
-(support [imgur](https://imgur.com) and [AliYun OSS](https://www.alibabacloud.com/product/object-storage-service), currently) and export markdown with image urls to clipboard directly.
+(support [imgur](https://imgur.com),[AliYun OSS](https://www.alibabacloud.com/product/object-storage-service) and [Imagekit](https://imagekit.io), currently) and export markdown with image urls to clipboard directly.
 The origin markdown in vault is still using local images.
 
 It will be help for publishing to the static site such [GitHub pages](https://pages.github.com).
@@ -26,6 +26,7 @@ and copy markdown with replaced image syntax to clipboard with notification.
 
 - [ ] support uploading images to more storages
   - [x] Aliyun Oss
+  - [x] ImageKit
   - [ ] Amazon S3
 - [x] setting for replacing images embedded in origin markdown directly
 

diff --git a/manifest.json b/manifest.json
@@ -6,5 +6,5 @@
   "authorUrl": "https://atbug.com",
   "isDesktopOnly": true,
   "minAppVersion": "0.11.0",
-  "version": "0.4.0"
+  "version": "0.5.0"
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "obsidian-image-upload-toolkit",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "",
   "author": "addozhang",
   "main": "main.js",
@@ -17,6 +17,7 @@
   },
   "dependencies": {
     "ali-oss": "^6.17.1",
+    "imagekit": "^5.0.0",
     "proxy-agent": "^5.0.0"
   }
 }
diff --git a/src/imageStore.ts b/src/imageStore.ts
@@ -15,6 +15,11 @@ export default class ImageStore {
         "AliYun OSS"
     )
 
+    static readonly ImageKit = new ImageStore(
+        "Imagekit",
+        "Imagekit upload"
+    );
+
     private constructor(readonly id: string, readonly description: string) {
         ImageStore.values.push(this)
     }

diff --git a/src/publish.ts b/src/publish.ts
@@ -11,6 +11,7 @@ import ImageStore from "./imageStore";
 import buildUploader from "./uploader/imageUploaderBuilder";
 import PublishSettingTab from "./ui/publishSettingTab";
 import {OssSetting} from "./uploader/oss/ossUploader";
+import {ImagekitSetting} from "./uploader/imagekit/imagekitUploader";
 
 export interface PublishSettings {
     imageAltText: boolean;
@@ -20,6 +21,7 @@ export interface PublishSettings {
     //Imgur Anonymous setting
     imgurAnonymousSetting: ImgurAnonymousSetting;
     ossSetting: OssSetting;
+    imagekitSetting: ImagekitSetting;
 }
 
 const DEFAULT_SETTINGS: PublishSettings = {
@@ -36,6 +38,13 @@ const DEFAULT_SETTINGS: PublishSettings = {
         endpoint: "https://oss-cn-hangzhou.aliyuncs.com/",
         path: "",
         customDomainName: "",
+    },
+    imagekitSetting: {
+        endpoint: "",
+        imagekitID: "",
+        privateKey: "",
+        publicKey: ""
+
     }
 };
 export default class ObsidianPublish extends Plugin {

diff --git a/src/ui/publishSettingTab.ts b/src/ui/publishSettingTab.ts
@@ -90,6 +90,9 @@ export default class PublishSettingTab extends PluginSettingTab {
             case ImageStore.ALIYUN_OSS.id:
                 this.drawOSSSetting(partentEL);
                 break;
+            case ImageStore.ImageKit.id:
+                this.drawImageKitSetting(partentEL)
+                break
             default:
                 throw new Error(
                     "Should not reach here!"
@@ -179,4 +182,45 @@ export default class PublishSettingTab extends PluginSettingTab {
                     .setValue(this.plugin.settings.ossSetting.customDomainName)
                     .onChange(value => this.plugin.settings.ossSetting.customDomainName = value))
     }
+
+    private drawImageKitSetting(parentEL: HTMLDivElement) {
+        new Setting(parentEL)
+            .setName("Imagekit ID")
+            .setDesc(PublishSettingTab.imagekitSettingDescription())
+            .addText(text =>
+                text
+                    .setPlaceholder("Enter your ImagekitID")
+                    .setValue(this.plugin.settings.imagekitSetting.imagekitID)
+                    .onChange(value => {
+                        this.plugin.settings.imagekitSetting.imagekitID = value
+                        this.plugin.settings.imagekitSetting.endpoint = `https://ik.imagekit.io/${value}/`
+                    }))
+
+        new Setting(parentEL)
+            .setName("Public Key")
+            .addText(text =>
+                text
+                    .setPlaceholder("Enter your Public Key")
+                    .setValue(this.plugin.settings.imagekitSetting.publicKey)
+                    .onChange(value => this.plugin.settings.imagekitSetting.publicKey = value))
+
+        new Setting(parentEL)
+            .setName("Private Key")
+            .addText(text =>
+                text
+                    .setPlaceholder("Enter your Private Key")
+                    .setValue(this.plugin.settings.imagekitSetting.privateKey)
+                    .onChange(value => this.plugin.settings.imagekitSetting.privateKey = value))
+    }
+
+    private static imagekitSettingDescription() {
+        const fragment = document.createDocumentFragment();
+        const a = document.createElement("a");
+        const url = "https://imagekit.io/dashboard/developer/api-keys";
+        a.textContent = url;
+        a.setAttribute("href", url);
+        fragment.append("Obtain id and keys from ");
+        fragment.append(a);
+        return fragment;
+    }
 }
diff --git a/src/uploader/imageTagProcessor.ts b/src/uploader/imageTagProcessor.ts
@@ -53,7 +53,7 @@ export default class ImageTagProcessor {
             let altText;
             for (const image of images) {
                 altText = this.settings.imageAltText ? path.parse(image.name)?.name?.replaceAll("-", " ")?.replaceAll("_", " ") : '';
-                console.log(`replacing ${image.source} with ![${altText}](${image.url})`);
+                // console.log(`replacing ${image.source} with ![${altText}](${image.url})`);
                 value = value.replaceAll(image.source, `![${altText}](${image.url})`);
             }
             if (this.settings.replaceOriginalDoc) {

diff --git a/src/uploader/imageUploaderBuilder.ts b/src/uploader/imageUploaderBuilder.ts
@@ -3,14 +3,17 @@ import ImageUploader from "./imageUploader";
 import ImageStore from "../imageStore";
 import ImgurAnonymousUploader from "./imgur/imgurAnonymousUploader";
 import OssUploader from "./oss/ossUploader";
+import ImagekitUploader from "./imagekit/imagekitUploader";
 
 export default function buildUploader(settings: PublishSettings): ImageUploader {
     switch (settings.imageStore) {
         case ImageStore.IMGUR.id:
             return new ImgurAnonymousUploader(settings.imgurAnonymousSetting.clientId);
-        //todo more cases
         case ImageStore.ALIYUN_OSS.id:
             return new OssUploader(settings.ossSetting);
+        case ImageStore.ImageKit.id:
+            return new ImagekitUploader(settings.imagekitSetting);
+        //todo more cases
         default:
             throw new Error('should not reach here!')
     }

diff --git a/src/uploader/imagekit/imagekitUploader.ts b/src/uploader/imagekit/imagekitUploader.ts
@@ -0,0 +1,37 @@
+import ImageUploader from "../imageUploader";
+import Imagekit from "imagekit";
+
+export default class ImagekitUploader implements ImageUploader {
+    private readonly imagekit!: Imagekit;
+
+    constructor(setting: ImagekitSetting) {
+        this.imagekit = new Imagekit({
+            publicKey : setting.publicKey,
+            privateKey : setting.privateKey,
+            urlEndpoint: setting.endpoint,
+        })
+    }
+    async upload(image: File, fullPath: string): Promise<string> {
+        const result = await this.imagekit.upload({
+            file : Buffer.from((await image.arrayBuffer())).toString('base64'),   //required
+            fileName : image.name,   //required
+            extensions: [
+                {
+                    name: "google-auto-tagging",
+                    maxTags: 5,
+                    minConfidence: 95
+                }
+            ]
+        });
+
+        return result.url;
+    }
+}
+
+
+export interface ImagekitSetting {
+    imagekitID: string;
+    publicKey: string;
+    privateKey: string;
+    endpoint: string;
+}