看啥推荐读物
专栏名称: 渴二
前端小渣渣
目录
相关文章推荐
今天看啥  ›  专栏  ›  渴二

使用 Alfred 在 markdown 中优雅的使用图片

渴二  · 掘金  ·  · 2019-04-28 08:25
阅读 67

使用 Alfred 在 markdown 中优雅的使用图片

应用场景

用 Markdown 写博客的苦恼就是不能方便的在文章中插入图片,所以需要一个好的图床来帮助我们存储图片返回图片链接,比如七牛云。但是为了插入一张图片,我们需要:

  1. 拿到图片
  2. 打开七牛云网站上传图片
  3. 复制图片外链地址
  4. 在 Markdown 文件中使用![]()插入图片
  5. 填写图片地址

当遇到博客内容需要插入大量图片时,真是心力交瘁,非常的不方便。所以需要一个工作流来帮助我们完成这些复杂的机械化工作。

预备工作

开始之前需要先安装必要的软件,并且注册七牛账号。

  1. 安装 Alfred with Powerpack 如果你的电脑还没有安装 Alfred ,需要先到 官网 下载,因为需要用到提供的 workflow 功能,所以需要购买,当然网上也有破解版的。
  2. 安装 qshell qshell 是七牛提供的命令行工具,以帮助大家更好的使用七牛服务。如何安装下载 qshell,参考 官方文档
  3. 注册七牛账号 七牛是一个云服务商,很多博客都用七牛的对象存储服务来做图床。不过现在测试域名只有30天的使用权限,如果想长期使用,还需要一个自己的备案域名

开始安装

准备工作都已经完成之后,下面开始安装配置 workflow。

  1. github 下载 qimage-mac 最新的 release 版本。 下载下来之后,解压进入文件夹下双击 Qiniu.alfredworkflow 文件安装 workflow 。

    点击 import。
    其中 Hostkey 为快捷键配置,Run Script 为 AppleScript 脚本,最右边两个为粘贴板和系统通知。

  2. 配置 workflow 环境变量。 点击上图标出的环境变量图标,看到如下四个配置项。

    AccessKey & SecretKey:这是 qshell 操作个人账号的凭证,登陆 七牛云 之后在 管理控制台 -> 个人中心 -> 密钥管理 中可以看到 AccessKey 和 SecretKey。也可以直接打开 portal.qiniu.com/user/key 看到。 bucket & bucketDomain:在 对象存储 -> 存储空间列表 中选择或者新建一个存储空间即 bucket,点击该 bucket 可以看到右侧有测试域名。不过目前测试域名有效期为 30天,长期使用的话需要绑定一个已经备案的域名。域名即为 bucketDomain。

  3. 设置快捷键并且关联应用。 双击 Hotkey 模块,设置自己习惯的快捷键用于触发该 workflow 执行。

    这里设置的是 option + command + v

  4. 因为 qshell 更新,需要更新 Run Script 脚本。双击 Run Script,在编辑器中替换代码。

    -- config start
    property bucket : (system attribute "bucket")
    property bucketDomain : (system attribute "bucketDomain")
    property AccessKey : (system attribute "AccessKey")
    property SecretKey : (system attribute "SecretKey")
    property Account : (system attribute "Account")
    -- config end
    
    -- md5(date) as file name
    set fileName to do shell script "date \"+%Y%m%d%H%M%S\" | md5"
    
    -- see if clipboard is a file
    set filePath to ""
    try
    	set clipPath to the clipboard as «class furl»
    	set filePath to clipPath as alias
    	-- like "/Users/jverson/Pictures/igarss/IMG_20140720_221838.jpg"
    	set filePath to quoted form of POSIX path of filePath
    	set filePath to second item of my theSplit(filePath, "'")
    	set tempArray to my theSplit(filePath, ".")
    	-- like "jpg" or "png" or "gif" or "mp4"
    	set fileType to last item of tempArray
    end try
    
    if filePath is not "" then
    	set fileName to fileName & "." & fileType
    	set markdownUrl to my upload(fileName, filePath, fileType)
    	return markdownUrl --end
    end if
    
    
    -- see if clipboard is image data
    set jpegDATA to ""
    try
    	set jpegDATA to the clipboard as JPEG picture
    end try
    if jpegDATA is not "" then
    	set tempPath to "/tmp/"
    	set fileName to fileName & ".jpg"
    	set filePath to tempPath & fileName
    	set theFile to open for access filePath with write permission
    	write jpegDATA to theFile
    	close access theFile
    	set markdownUrl to my upload(fileName, filePath, "jpg")
        -- delete temp file
        do shell script "rm " & filePath
    	return markdownUrl
    end if
    
    beep 1
    display dialog ¬
    	"No file or image data found on the clipboard." with icon ¬
    	note buttons {"Whatever"} default button 1
    return
    
    -- string split function
    -- ref: http://erikslab.com/2007/08/31/applescript-how-to-split-a-string/
    on theSplit(theString, theDelimiter)
    	-- save delimiters to restore old settings
    	set oldDelimiters to AppleScript's text item delimiters
    	-- set delimiters to delimiter to be used
    	set AppleScript's text item delimiters to theDelimiter
    	-- create the array
    	set theArray to every text item of theString
    	-- restore the old setting
    	set AppleScript's text item delimiters to oldDelimiters
    	-- return the result
    	return theArray
    end theSplit
    
    -- upload image to qiniu
    on upload(fileName, filePath, fileType)
        -- compress image todo..
    
        -- qiniu account set
        set account_commond to "/usr/local/bin/qshell account -w " & AccessKey & " " & SecretKey & " " & Account
        do shell script account_commond
        -- upload to qiniu
    	set upload_command to "/usr/local/bin/qshell fput " & bucket & " " & fileName & " " & filePath
    	do shell script upload_command
        -- strcat url
        set resourceUrl to bucketDomain & fileName
        if (fileType is "png") or (fileType is "jpg") or (fileType is "gif") or (fileType is "bmp") or (fileType is "jpeg") then
    	    set markdownUrl to "![](" & resourceUrl & ")"
    	    return markdownUrl
        else
            return resourceUrl
        end if
    
    end upload
    
    -- ref:https://discussions.apple.com/thread/2379870?start=0&tstart=0
    复制代码

    并点击图中环境变量图标,添加变量 Account ,值为你七牛的用户名。

  5. 开始使用。 现在就可以开始使用了,如果不按预期正常工作,可以点击 debug 按钮,查看控制台报错。

使用

  1. 截图之后图片保存到粘贴板中。
  2. 在 Markdown 文件中需要插入的地方,使用之前设置的快捷键 option + command + v ,图片地址就被插入粘贴板中了,在需要使用的地方使用 ctrl + v 粘贴就可以了。

遇到的问题

  1. 控制台提示 execution error: sh: /usr/local/bin/qshell: No such file or directory (127) 解决:需要给 qshell 能够在任何位置都可以执行,需要把 qshell 所在的目录加到环境变量 $PATH 中去,或者将 qshell 执行文件复制到 /usr/local/bin 文件夹下。



原文地址:访问原文地址
快照地址: 访问文章快照