Skip to content

Use image/file hosting in Obsidian by clipboard or draging file. Obsidian 图床聚合 & Github上传器

License

Notifications You must be signed in to change notification settings

yaleiyale/obsidian-emo-uploader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Obsidian Emo Uploader

Embed markdown online file/image links.
This plugin is for uploading images to hosting platform or files to Github(more, now) in Obsidian.

图床聚合 & 文件上传器 : Imgur SM.MS Github Cloudinary Catbox ……

🚩中文

How it Works

case-obsidian-emo-uploader.mp4

State

file hosting image hosting Multi language support
GitHub Imgur 简体中文
Clouinary SM.MS 繁體中文 @emisjerry
Catbox ImgURL English
AList imgbb
chevereto

V2.17

support AList, thanks to Linnnkkk.

V2.16

Adapted to chevereto v3

V2.15

support chevereto

V2.14

Add Github cdn switch

Tips

If you want to create your own client-ID In Imgur, Redirect: obsidian:https://emo-imgur-oauth.
Remember your username when registering catbox.🤨

Starting from version 2.6, clipboard and drag files are supported; Non-image files will appear as links without "!" at the beginning by default after being embed in markdown.

How to Extend

Want to support more platforms? If you want to contribute and don't want to make too much effort on reading old code, you can extend it in the following ways.

  • Refer to existing parms files, and add the parameters required by your new uploader by adding files to src/Parms.
  • Use your parms interface. In config.ts, add parameter configurations about your uploader to provide choices and act as constructors for uploader at run time.
  • Implement your uploader and settings panel by adding files to src/Uploader, src/Fragment.
  • In settings-tab.ts,add your fragment to show and set parameters in the setting-tab.
  • Add your uploader to the UploaderMap in main.ts.
  • Test it.

It's done! 😽

Configuration

  1. Disable Obsidian Safe Mode
  2. Install the Plugin
    • Install from the Obsidian Community Plugins tab
    • use Release
      • download main.js manifest.json or zip file in the latest Release
      • move main.js manifest.json in a folder in your obsidian vault's plugin folder
    • Manual install
      • Clone this repo
      • Install dependencies with yarn or npm like npm install
      • yarn run dev will start compilation
  3. Enable the Plugin
  4. Configure the settings 👉 some datails: take configuring github as an example
  5. Enjoy convenience 🌟

About Uploading to Github

For uninitiated visitors from outside the code world, Github is a famous internet hosting service for software development and version control using Git.
If you need more help on hosting images, go to the other parts. These services are more focused on this.

What is It?

This part allows you to automatically upload files pasted to Obsidian directly into your Github repository ( instead of stored locally ). It's useful when you want to mention a file in your note which you think is good for sharing like script, config-file or anything.
Of course, it can be a simple image uploader. It does a good job of embedding images into markdown files.
But more than a image uploader, You can upload various types of files, as long as Github accepts them.
Whether the file link can be rendered in obsidian or not depends on the support of obsidian itself. It doesn't matter, even if they can't be rendered, they can still be used as links. 🍭 Just remove the exclamation point at the beginning.

About Use Policy

GitHub terms-of-service
jsdelivr Use Policy

⚠️ Note that

  1. The Github target repository must be public, which means that all files uploaded are public. Github should also be more for those who are happy to share. Please make sure that it is harmless for you to share the files you upload. Personally, I'm looking forward to the day when one of your uploads will be for selfless sharing.  🌻  
  2. Do not upload Empty file. It's meaningless and wrong here.
  3. It is recommended to check the random filename in the panel. Duplicate file name will raise an error. Random file names will greatly avoid duplicate file names.  
  4. In general, Github is generous enough. But you need to get a sense of proportion, don't abuse Github's services too hard. Take it easy, normal use, such as in Github pages, is of course acceptable. But if you need to use images in large quantities, please use a professional image hosting service. ( Now it has been integrated into this plugin ). Going beyond the normal range (e.g. storing more than 1GB files in a single repository), abusing Github, and uploading bad files with undesirable effects may cause your Github repository or even account to be affected.
  5. I use jsdelivr here. It is free. Just like above, don't abuse it. Just like what I do in the video, it's not good to use jsdelivr on transferring large video, I have deleted it. My case is a small size video. 😼

About the Other

Except for github, all the others here are purely hosting platforms. Register an account and find parameters you need. Just put your parameters to the correct positions. Then you can use it just like the way in the video.

ImgURL, SM.MS are cloud storage platforms that allows you to upload images to a storage account. For users living in China, they are easier to access than Github and Cloudinary.

About Cloudinary, please refer to obsidian-cloudinary-uploader/README.md. Of course, Cloudinary is supported here. If you find that Cloudinary is enough to meet your needs, you can just use it. ( In fact, my plugin is smaller on size. 😳 )

If you live in China, imgbb is not recommended to use. I found that the pictures uploaded to this platform could not be easily accessed in Chinese Mainland and they are usually presented as thumbnails.

Imgur is good. But in my network environment, it is not easy to access and test. I simply implemented anonymous upload with reference to some posts. Thanks for this reference. When using imgur anonymous upload, deletehash will appear in the form of ![deletehash](url), which is used to prevent you from regretting the upload of wrong pictures. You can delete them here or in the plugin.

Catbox originally supports anonymous uploads. But I didn't find out how to delete anonymously uploaded files. To avoid accidents, anonymous uploads of catbox are not provided here.

⚠️ Files are public to see on them. Don't upload prohibited things! Please check the service restrictions by yourself.

Note

Due to the different range of files supported by different platforms, there are no restrictions on the types of files you paste in this plugin. This will lead to the situation that unsupported types are uploaded failed without a correct response. Fortunately, there are not many cases in which strange file types are embedded in documents. (there won't be many, right? )

If you need to embed the file as an attachment, please close the plugin temporarily.

In general, Github, Cloudinary, Catbox supports any file type, SM.MS, ImgURL supports common image types.

Trying to upload a file that the platform does not support or volume exceeds the upper limit may result in a string like ![](undefined). Notice it, don't just wait.


If you are enjoying the plugin then you can support my work and enthusiasm by buying me a cola:

BuyMeACola

Thank you!

Thanks

Thanks
obsidian-cloudinary-uploader Github REST API jsdelivr
SM.MS ImgURL Clouinary
Imgur imgbb obsidian-imgur-plugin
Catbox chevereto AList

About

Use image/file hosting in Obsidian by clipboard or draging file. Obsidian 图床聚合 & Github上传器

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published