一键生成文章配图

麻烦,就是还不够好。只有减少不必要的繁琐,才能让我们有更多的时间聚焦在正在有意义的事情上。

最近输入的信息越来越多,难免不久就开始遗忘,觉得可惜,想找个地方记录下来。于是花了半天时间搭建了这个博客。刚搭建完,一直在想要写什么主题呢?思来想去,找不到一个让我觉得很特别的主题。

睡了一晚,脑子里迸发了很多东西,不成文,但也都挺有趣。于是决定,这个博客就写写日常的所思所想和笔记草稿吧。这么一想,轻松多了。

写文章,难免有时候需要一些配图,或是点缀,或是渲染气氛。但是之前写过公众号就知道,有时候为了找一张合适的配图,能花上一小时。实在是浪费,好在现在是自己搭建的博客,我想让文章能自己配图。

网上搜了一下,找到的自动配图插件都差强人意。但好在找到很多好的图片资源,并且都是满足CC0协议的无版权图片,实在是太棒了!

我尤其喜欢链接式的随机图片接口,还能指定大小。就是你在url 上给定宽高,会随机返回一张图片给你。这样的链接图片插入网页中,每次访问都不一样,一点都不单调,关键图片质量还很高,一点都不比自己配图差。比如说上面这张图片就是,你可以刷新试试。这里推荐一个我最喜欢的接口。

https://source.unsplash.com/random/800x400

当然,这样的接口其实还很多,主要看图片质量和响应速度,统一整理在这里,之后我会继续添加,也欢迎大家在评论区分享。

http://lorempixel.com/200/200/

https://unsplash.it/1000/300?random

https://source.unsplash.com/random

https://source.unsplash.com/random/200x200

https://www.xwboke.cn/api/api.php

https://picsum.photos/200/300/?random

http://img.xjh.me/random_img.php

目前我的站点首页图片,就是用的unsplash,文章里的图片也是插入的链接,但文章里每次插入的大小和位置,最好是由自己来控制的。这样的话,我们就要每次手动输入https://source.unsplash.com/random/800×400这样一个链接,其实记不住,而且还有点麻烦,要是能一键复制过来就好了。好的,就怎么干,实现一个一键复制功能。其实很简单,一分钟你就能搞定。

因为我们写博客都是在浏览器里写,所以要利用浏览器的能力来实现一键复制,想法很简单,把这个链接加入书签,打开就能复制。思路对了,但是加入书签每次需要打开新页面,有点麻烦。另外,上面的智能裁剪链接,其实都是有302重定向的,你打开后复制到的链接就变了,不再具有随机图片功能。那怎么办呢?其实浏览器书签也是可以编程的,和a 标签执行代码一样的原理。

<a href = "javascript:js_method()">文本</a> 

所以,我们只需要在添加书签的时候,在填链接的输入框中输入一段执行复制的js代码就行了,代码我都给你写好了,复制过去就能用。

javascript:void((function(){
    const input = document.createElement('input');
    document.body.appendChild(input);
    input.setAttribute('value', 'https://source.unsplash.com/random/1000x500');
    input.select();
    if (document.execCommand('copy')) {
        document.execCommand('copy');
    }
    document.body.removeChild(input);
})())

怎么样?试试呗,这个方法还能制作很多有趣的小工具,就当抛砖引玉了。

工欲善其事必先利其器。

Leave a Comment

邮箱地址不会被公开。 必填项已用*标注