The general process of modifying the mailbox, mobile phone number and other processes in Vue, the verification code is generated and verified by redis on the back end (version 1.0)

Architect's full-stack road 2022-11-24 22:35:21 阅读数:559


Record a little about the general implementation process of modifying the mobile phone number and email address.Temporarily set to version 1.0

1. General idea

Insert image description here

2. Modify mobile phone number

2.1 Account settings display

The mobile phone and mailbox here are partially hidden, and the way to realize it is very simple, just use a filter.Tip Here, by clicking on the field, jumping to the page, calling the method and then triggering the routing jump, you can jump according to the set name, which is convenient for thieves

Insert image description here

2.2 Old number verification interface

The verification code here is generated and implemented by the backend, and it is temporarily displayed to the user in the form of a pop-up window, and then the user enters the corresponding verification code.In the later stage, you can access the real mobile phone verification code interface, the aip interface that can send hundreds of pieces for a few cents

Insert image description here

2.3 New number verification interface

Here, verify whether the new number is available, and then modify it. The verification code principle is the same as 2.2

Insert image description here

3. Modify email

The idea is the same as modifying the mobile phone number, only the page effect is given here

3.1 Account settings display

Insert image description here

3.2 Old email verification interface

Insert image description here

3.3 New email verification interface

Insert image description here

4. Postscript

There is no end to learning......

版权声明:本文为[Architect's full-stack road]所创,转载请带上原文链接,感谢。