微信小步伐上怎样利用图形验证码

1、php服务器天生图片验证码的代码片断如下：

注意红框部分的代码，天生的是ArrayBuffer范例的二进制图片
2、表现验证码
表现验证码，不要直接image组件加上src表现，那样拿不到cookie，没有办法做图形验证码的验证，必要通过接口的方法获取，上接口代码如下：

2. function get_verify_code(url, success, fail, complete) {
3.         if (request_status == true) {
4.                 return;
5.         }
6.         request_status = true;
7.         let header = {
8.                 'Content-Type': 'application/x-www-form-urlencoded'
9.         };
10.         uni.request({
11.                 url: url,
12.                 timeout: 60000,
13.                 header: header,
14.                 responseType: 'arraybuffer',//这个地方不要写错
15.                 method: 'GET',
16.                 success: res => {
17.                         request_status = false;
18.                         if (res.statusCode == 200) {
19.                                 let cookieKey = '';
20.                                 let data = res.data;//拿的图片
21.                                 // #ifdef MP-WEIXIN
22.                                 if (res && res.header && res.header['Set-Cookie']) {
23.                                         cookieKey = res.header['Set-Cookie'];//拿cookie
24.                                 }
25.                                 // #endif
26.                                 success({"data":data,"cookieKey":cookieKey});
27.                         } else if (res.statusCode == 404) {
28.                                 success({"success": false,"field": "fail_net","message": "请求的资源不存在"});
29.                         } else if (res.statusCode == 500) {
30.                                 success({"success": false,"field": "fail_net","message": "内部服务器错误"});
31.                         } else {
32.                                 success({"success": false,"field": "fail_net","message": "请求异常"});
33.                         }
34.                 },
35.                 fail: (e) => {
36.                         if (request_status == true) {
37.                                 request_status = false;
38.                         }
39.                         fail(e);
40.                 },
41.                 complete: (e) => {
42.                         if (request_status == true) {
43.                                 request_status = false;
44.                         }
45.                         complete(e);
46.                 }
47.         });
48. }

复制代码

表现图片的利用代码如下：

2. get_verify_code(v) {
3.                                 let url = `${base_url}get_verify_code/${v}`;
4.                                 //console.log('url:'+url);
5.                                 this.$net.get_verify_code(
6.                                         url,
7.                                         res => {
8.                                                 const base64 = uni.arrayBufferToBase64(res.data);
9.                                                 this.imageData  = `data:image/png;base64,${base64}`;
10.                                                 // #ifdef MP-WEIXIN
11.                                                 if (res.cookieKey) {
12.                                                         uni.setStorageSync('cookieKey', res.cookieKey);
13.                                                 }
14.                                                 // #endif
15.                                         },
16.                                         () => {
17.                                         },
18.                                         () => {
19.                                         }
20.                                 );
21.                         },

复制代码

如许图片就可以正常表现了，提交的方法里要带上cookie，如许就可以验证验证码了。