Image Attachment Upload

approved

by rocketBANG

Pick an image, upload it to Cloudflare R2, and insert it inline or set it as the note's image property. - This plugin has not been manually reviewed by Obsidian staff.

45 downloadsUpdated 25d ago0BSD

Image Attachment Upload

Obsidian plugin: adds commands to pick an image on your device, upload it to Cloudflare R2, and drop it into the current note — either as an inline embed or as a frontmatter property.

Works on desktop and mobile (signing is done on-device with the Web Crypto API; no SDKs, no CORS setup needed on the bucket).

Commands

  • Upload image and insert inline — opens a file picker, uploads to R2, inserts ![<note name>](<public url>) at the cursor.
  • Upload image and set image property — opens a file picker, uploads to R2, sets the note's image frontmatter property (name configurable) to the public URL.

Setup

  1. Create an R2 API token (Object Read & Write, ideally scoped to one bucket) — this gives you an access key ID + secret.
  2. Serve the bucket publicly via a custom domain (or the bucket's r2.dev development URL).
  3. Fill in the plugin settings: access key ID, secret, endpoint (https://<account-id>.r2.cloudflarestorage.com), bucket name, path template, and the public base URL.

Object keys follow the path template (default /{year}/{mon}/{day}/{filename}), with a short random suffix added to the filename to avoid collisions.

Note: like most uploader plugins, credentials are stored in plaintext in the plugin's data.json inside your vault. Scope the R2 token to the one bucket, and keep that file out of any git repo your vault lives in.

Installing via BRAT

Add rocketBANG/obsidian-image-attachment-upload as a beta plugin in BRAT.

Manually installing the plugin

Copy main.js, styles.css, and manifest.json into <vault>/.obsidian/plugins/image-attachment-upload/.

Development

Requires NodeJS v22.13+ and pnpm 11.

  • pnpm i to install dependencies.
  • pnpm run dev to start compilation in watch mode (produces main.js).
  • pnpm run build for a production build.
  • pnpm run lint to lint.

Releasing

  • Run pnpm version patch (or minor / major) after updating minAppVersion manually in manifest.json if needed — this bumps manifest.json, package.json, and versions.json.
  • Push a tag matching the exact version number (no v prefix); the release workflow builds the plugin and drafts a GitHub release with main.js, manifest.json, and styles.css attached.

For plugin developers

Search results and similarity scores are powered by semantic analysis of your plugin's README. If your plugin isn't appearing for searches you'd expect, try updating your README to clearly describe your plugin's purpose, features, and use cases.