資訊專(zhuān)欄INFORMATION COLUMN
摘要：滑動(dòng)圖片驗(yàn)證碼基于和的一個(gè)圖片滑動(dòng)驗(yàn)證碼效果圖使用前端后端業(yè)務(wù)邏輯前端請(qǐng)求數(shù)據(jù)后臺(tái)返回主圖片，和小滑塊圖片前端交互，滑動(dòng)之后，獲取滑動(dòng)的值將用戶(hù)信息和傳給后臺(tái)后臺(tái)判斷是否正確，返回信息給前端后端這里主要是圖片處理的問(wèn)題，嘗試過(guò)。
滑動(dòng)圖片驗(yàn)證碼
基于 react 和 koa2 的一個(gè)圖片滑動(dòng)驗(yàn)證碼效果圖 使用
git clone https://gitee.com/darcrandex/image-code.git
// 前端 cd image-code/client npm i npm start
// 后端 cd image-code/server npm i npm start業(yè)務(wù)邏輯
前端請(qǐng)求數(shù)據(jù)
后臺(tái)返回主圖片，和小滑塊圖片
前端交互，滑動(dòng)之后，獲取滑動(dòng)的 x 值
將用戶(hù)信息和 x 傳給后臺(tái)
后臺(tái)判斷是否正確，返回信息給前端
后端這里主要是圖片處理的問(wèn)題，嘗試過(guò)node-canvas,node-images,node-sharp。但是都存在安裝不了或者需要安裝很麻煩的依賴(lài)庫(kù)的問(wèn)題。最后選擇node-gm。基本上可以滿(mǎn)足需求。
不過(guò)還是需要安裝一個(gè)依賴(lài)庫(kù)，GraphicsMagick或者ImageMagick。推薦是GraphicsMagick，但其實(shí)ImageMagick也夠用了。
關(guān)于安裝ImageMagick。我的環(huán)境是windows，除了安裝軟件之外，還需要配置windows 環(huán)境變量。網(wǎng)上查一下好了。
前端前端部分沒(méi)有什么大的問(wèn)題。只有axios需要配置一下(/src/utils/axios.js)，主要是跨越的問(wèn)題。如果不使用axios，就根據(jù)情況解決跨域就可以了。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/53872.html
摘要：滑動(dòng)圖片驗(yàn)證碼基于和的一個(gè)圖片滑動(dòng)驗(yàn)證碼效果圖使用前端后端業(yè)務(wù)邏輯前端請(qǐng)求數(shù)據(jù)后臺(tái)返回主圖片，和小滑塊圖片前端交互，滑動(dòng)之后，獲取滑動(dòng)的值將用戶(hù)信息和傳給后臺(tái)后臺(tái)判斷是否正確，返回信息給前端后端這里主要是圖片處理的問(wèn)題，嘗試過(guò)。 滑動(dòng)圖片驗(yàn)證碼 基于 react 和 koa2 的一個(gè)圖片滑動(dòng)驗(yàn)證碼 效果圖 showImg(https://segmentfault.com/img/bVb...
摘要：我是一個(gè)知乎輕微重度用戶(hù)，之前寫(xiě)了一只爬蟲(chóng)幫我爬取并分析它的數(shù)據(jù)，我感覺(jué)這個(gè)過(guò)程還是挺有意思，因?yàn)檫@是一個(gè)不斷給自己創(chuàng)造問(wèn)題又去解決問(wèn)題的過(guò)程。所以這只爬蟲(chóng)還有登陸知乎搜索題目的功能。 我一直覺(jué)得，爬蟲(chóng)是許多web開(kāi)發(fā)人員難以回避的點(diǎn)。我們也應(yīng)該或多或少的去接觸這方面，因?yàn)榭梢詮呐老x(chóng)中學(xué)習(xí)到web開(kāi)發(fā)中應(yīng)當(dāng)掌握的一些基本知識(shí)。而且，它還很有趣。 我是一個(gè)知乎輕微重度用戶(hù)，之前寫(xiě)了一只爬...
摘要：小練習(xí)作者本文首發(fā)博客功能基于進(jìn)行登錄，注冊(cè)，留言的簡(jiǎn)單網(wǎng)站。所以這個(gè)小練習(xí)，從一個(gè)簡(jiǎn)單的方面入手，希望能給踩過(guò)同樣多坑的同路人一點(diǎn)啟發(fā)。就意味著要重新登錄。的作用是進(jìn)行進(jìn)程守護(hù)，當(dāng)你的意外的停止的時(shí)候，進(jìn)行重啟。 Vue+Koa+Mongodb 小練習(xí) 作者： Pawn 本文首發(fā)： Pawn博客 功能： 基于vue koa mongodb進(jìn)行登錄，注冊(cè)，留言的簡(jiǎn)單網(wǎng)站。 體驗(yàn)地址： ...
摘要：平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累，以每月的形式發(fā)布。年以前看這個(gè)網(wǎng)址概況在線地址前端開(kāi)發(fā)群月報(bào)提交原則技術(shù)文章新的為主。 平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累，以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址：http://www.kancloud.cn/jsfron... 概況 在線地址：http://www.kancloud.cn/jsfront/month/82796 JS前端開(kāi)發(fā)群月報(bào) 提交原則： 技...
閱讀 2067·2021-11-11 16:55
閱讀 1401·2021-09-28 09:36
閱讀 1047·2019-08-29 15:21
閱讀 1578·2019-08-29 14:10
閱讀 2764·2019-08-29 14:08
閱讀 1638·2019-08-29 12:31
閱讀 3251·2019-08-29 12:31
閱讀 983·2019-08-26 16:47
