### 素材管理

在一次專案中，為了使驗證碼更加貼合自身風格。我找到了一款驗證碼產品可以透過設定圖片素材，來修改驗證碼的底圖，使其更加契合。下面就是我對該產品的一些記錄。

### 我的素材

進入到素材管理，我的素材一般預設為空，可以透過檔案上傳和從官方素材庫中選擇。

![](http://img.blog.itpub.net/blog/2023/04/20/34dd8bb99bf937c9.png?x-oss-process=style/bb)

接下來，點選按鈕實現上傳圖片：

![](http://img.blog.itpub.net/blog/2023/04/20/707e63e49bd3194d.png?x-oss-process=style/bb)

預覽我的圖片素材：

![](http://img.blog.itpub.net/blog/2023/04/20/d88ea86f556c3b4f.png?x-oss-process=style/bb)

![](http://img.blog.itpub.net/blog/2023/04/20/e1e44603a97f3c60.png?x-oss-process=style/bb)

前端驗證碼的圖片顯示：

![](http://img.blog.itpub.net/blog/2023/04/20/372678d4d10142ac.png?x-oss-process=style/bb)

### 素材庫

官方也提供了一些圖片給使用者選擇，使用者只需進入素材庫，透過選擇自己喜歡的圖片，點選即可加入我的素材。

![](http://img.blog.itpub.net/blog/2023/04/20/8004f1fafe7e7841.png?x-oss-process=style/bb)

選擇圖片到我的素材：

![](http://img.blog.itpub.net/blog/2023/04/20/56f105a778a61e7e.png?x-oss-process=style/bb)

我的素材加入成功：

![](http://img.blog.itpub.net/blog/2023/04/20/f22fbba133bedd4d.png?x-oss-process=style/bb)

前端驗證碼顯示：

![](http://img.blog.itpub.net/blog/2023/04/20/dd80042f84172126.png?x-oss-process=style/bb)

### 相關連結

SDK下載：[**https://github.com/KgCaptcha**](https://github.com/KgCaptcha)

線上體驗：[**https://www.kgcaptcha.com/demo/**](https://www.kgcaptcha.com/demo/)

【記錄】KgCaptcha滑動拼圖驗證碼

相關文章