h5 & amp; & amp; small program access to extreme experience, prevent malicious sending of SMS, improve safety

Posted May 27, 20202 min read

In daily business development, we must often encounter user login requirements, especially front-end pages such as operational activities. What cannot be bypassed is to send verification codes according to mobile phone numbers. In order to avoid being forced to send verification codes , So it is necessary to access the extreme experience plug-in. Personally summarized the actual use scenarios of extreme experience for your reference, to avoid entering the pit
Jiyan official document address: https://docs.geetest.com/sens...

h5 Extreme configuration

  • Download the gt file in the official document(this gt file is placed in the server-side sdk, clone it down and copy it out from it), and put it in your own project, I put it under the public file,


  • Then use direct reference injection if a page is used. For example, I put it on my page and directly reference it. The gt file is an immediate execution function mounted on the window![Image.png]( https://i0 .wp.com/segmentfault.com/img/bVbHEGz "image.png")

  • The preparation work has been completed, the next step is to initialize the ultimate verification example(the principle of extreme verification is that the server obtains the official SDK to sign once, and then access the interface api1 to complete the initialization) Image.png

  • Next, we encapsulate the api1 interface(provided by your server, mainly used to obtain the initial verification of gt, challenge, and success fields)![Image.png]( https://i0.wp . com/segmentfault.com/img/bVbHEMd "image.png")

  • Then send the verification code every time(api2 your backend sending verification code interface must be post, if it is get, escape it) ** Remember that every time you send the verification code button click, you need to get api1 again and re-initialize the verification * * image.png

  • When the polar test is initialized and ready, directly hang the polar test box(here I use the product mode) .If you want to configure other modes, you can refer to the official documents(float, popu, custom, bind). Return, provide three callbacks, success, error, close three callbacks to handle your logic code Image.png ![image.png]( https://i0.wp.com/segmentfault.com/img/bVbHEQN" image.png ") \ * \ * Note that as long as you have operated too much, call its distory so it will be ok Off

The configuration of the applet is slightly different(because there is no dom, it is not possible to insert the ultimate dom, so you need to register the component in advance), subsequent updates