極驗與vue的原生js結合


既然說了極驗,那么我就簡單介紹一下極驗是一個什么工具:

極驗驗證是一種在計算機領域用於區分自然人和機器人的,通過簡單集成的方式,為開發者提供安全、便捷的雲端驗證服務。

與以往傳統驗證碼不同的是,極驗通過分析用戶完成拼圖過程中的行為特征,通過數據分析來判斷是人還是機器。用戶不必面對眼花繚亂的英文字符或漢字,整個驗證過程變的像游戲一樣有趣。

現在我們來說說如何將極驗前端的內容和vue用原生js進行結合:

一般來說,在jquery框架或者其它框架內,直接引入極驗前端的sdk或js文件即可,並且極驗的js文件是一個閉包函數,直接引入即可;但是在vue內想通過script標簽引入第三方js文件就不像傳統的前端框架或html文件那樣方便,因為vue本身是使用的es6語法,需要通過用webpack和gulp之類的工具編譯es6后再使用script,因此咱們還是中規中矩用點簡單的方法來引入:

將極驗的閉包函數賦值給一個變量,然后通過es6的export default導出(當然也可以直接將該閉包函數通過export default導出)

 


 

 

然后就可以在你想使用極驗驗證碼的地方,通過import導入極驗的閉包函數,由於閉包函數將想要返回的initGeetest函數賦傳給了window,因此可以通過調用window.initGeetest({})函數來使用極驗了:

 


 

window.initGeetest的回調函數的參數是極驗驗證碼的dom,在該回調函數內可將驗證碼dom放置在你的頁面任何地方,然后你就可以看到你的vue頁面出現了極驗驗證碼啦~(具體的函數、參數等內容請在注冊極驗驗證碼帳號后查看官方文檔)。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM