驗證碼是常見的登錄或注冊的驗證方式，目前已經衍生出包含圖形、文字、運算等多種驗證方式。本文作者主要介紹怎么使用 Axure 來設計一個動態的數學運算驗證碼，希望對你有幫助。

在軟件設計中，為了防止暴力注冊或爬蟲爬取等機器請求，需要驗證操作者本尊是人還是機器，因此催生了驗證碼這個設計。

目前驗證碼已經衍生出許多的形式，包括圖形驗證、數學運算、點選文字、滑動拼圖等，本文作者主要介紹怎么使用 Axure 來設計一個動態的數學運算驗證碼。

先看一下效果（傳送門>>)：

本文有不少的知識點我在《【Axure 教程】驗證碼，除了 12306，我還沒有服過誰（圖形驗證篇）》中已經介紹過，所以本文直接進入主題，其實也是因為在撰寫本文的時候，作者正頂著38.5的體溫，實在有點扛不住了，如果這篇文章對你有用的話，請幫忙點個“收藏”和“喜歡”。

外觀外觀方面我就不多做說明，可以參考上方提到的文章，接下來直接上教程。

一、全局變量

下面是需要用到的變量：

每個變量的作用分別是：

• num1：存儲生成的第一個數
• num2：存儲生成的第二個數
• num1_up_limit：num1 的上限，默認50
• num2_up_limit：num2 的上限，默認50
• ops：運算符集，默認【+-*/】，四則運算，如果不想那么為難用戶，可以只保留【+-】
• op：存儲從【ops】中取出的運算符
• formula：存儲生成的完整公式
• cal_result：生成公式的計算結果，可以用于對比驗證用戶輸入的結果是否與預期結果匹配

二、動態面板

需要用到兩個動態面板，其中一個是用來作為公式的生成器，另外一個用來做整除判斷，如果生成的運算符【op】是【/】的時候，需要校驗生成的數是否能夠整除，不能則需重新生成：

三、驗證碼圖片邏輯

驗證碼圖片的邏輯很簡單，首先是【單擊時】將兩個數值和運算符變量清空，這樣每次點擊的時候才能通過相關變量是否有值來判斷生成成功與否，接著開啟驗證碼生成器循環，開始生成驗證碼公式，最后在添加【載入時】點擊驗證碼圖片的事件：

四、驗證碼生成器邏輯

首先要生成運算符，因為如果涉及到【-】或者【/】的時候，需要確保生成的數值減完之后不會變成負數，或者出現不能整除的情況，生成邏輯就是直接從【ops】隨機抽取一個：

接著生成【num1】，因為【num1】是前面的數，所以怎么生成都行，只要確保在【num1_up_limit】內即可：

生成【num2】就復雜得多，需要根據運算符【op】來生成，如果是【+】和【*】，則生成規則與【num1】一致，如果【op = -】，則【num2】的上限應該是【num1】，這樣才不會減出來負數，至于【op = /】的邏輯，下一板塊來講：

接下來是生成公式，生成公式按運算符【op】分為4個場景，其實每個場景都一樣，但是因為 Axure 中沒法直接用變量作為運算符，所以只能分4個場景并手動輸入運算符，這樣才能獲得結果

五、整除判斷

上圖中可知，當運算符【op = /】時，啟動整除運算器的循環，整除運算器邏輯如下：

如果不能整除就循環生成，直到可以整除為止，如果有什么不懂的歡迎在評論區留言，等我扛過去了會一一答復，感謝閱讀。