确保这个登陆态接口是能够正常请求返回并成功提取 需要用到的参数的。
之后普通接口自动添加登陆态的时候,走的其实是另一套类似的新函数。
打开P_apis.html,给Send按钮加上onclick并且下面新建login_send函数:
具体的代码呢,和普通接口调试层类似,复制过来改改即可,当然我仍然会先改好,再贴可复制的代码:
unction login_send() { // 获取接口的所有数据 var login_method = document.getElementById('login_method').value ; var login_url = document.getElementById('login_url').value ; var login_host = document.getElementById('login_host').value ; var login_header = document.getElementById('login_header').value ; var login_response_set = document.getElementById('login_response_set').value; // 判断顶部的数据是否填充完 if(login_method == 'none'){alert('请选择请求方式!');return} if(login_url == ''){alert('请输入url!');return} if(login_host == ''){alert('请输入host!');return} //判断关键数据是否符合规则 if(login_host.slice(0,7) != 'http://' && login_host.slice(0,8) != 'https://' && login_host.slice(0,4) !='全局域名'){ alert('host必须以http://或https://开头!');return } if(login_header != ''){ try { JSON.parse(login_header) }catch (e) { alert('header请求头不符合json规范!'); return } } var login_body_method = $('ul#login_myTab li[class="active"]')[0].innerText; if(login_body_method == '返回体'){ alert('请切换到请求体tab再保存!'); return } if(login_body_method == 'none'){ var login_api_body = '' } if(login_body_method == 'form-data'){ var login_api_body = []; //新建这个空列表用来存放后续的数据 var tbody_ = $("table#login_mytable tbody")[0]; //获取该表格的内容部分 var trlist = tbody_.children ; //获取下面所有tr,每个tr就是一个键值对实际上 for(var i=0;i<trlist.length;i++) { var tdarr = trlist[i].children; // 获取tr下的俩个td var key = tdarr[0].innerText; // 获取key var value = tdarr[1].innerText; // 获取value login_api_body.push([key, value]);// 作为一个数组,存放到这个大数组里。 } login_api_body = JSON.stringify(login_api_body); } if(login_body_method == 'x-www-form-urlencoded'){ var login_api_body = []; //新建这个空列表用来存放后续的数据 var tbody_ = $("table#login_mytable2 tbody")[0]; //获取该表格的内容部分 var trlist = tbody_.children ; //获取下面所有tr,每个tr就是一个键值对实际上 for(var i=0;i<trlist.length;i++) { var tdarr = trlist[i].children; // 获取tr下的俩个td var key = tdarr[0].innerText; // 获取key var value = tdarr[1].innerText; // 获取value login_api_body.push([key, value]);// 作为一个数组,存放到这个大数组里。 } login_api_body = JSON.stringify(login_api_body); } if(login_body_method == 'Text'){ var login_api_body = document.getElementById('login_raw_Text').value; } if(login_body_method == 'JavaScript'){ var login_api_body = document.getElementById('login_raw_JavaScript').value; } if(login_body_method == 'Json'){ var login_api_body = document.getElementById('login_raw_Json').value; } if(login_body_method == 'Html'){ var login_api_body = document.getElementById('login_raw_Html').value; } if(login_body_method == 'Xml'){ var login_api_body = document.getElementById('login_raw_Xml').value; } if(login_body_method == 'GraphQL'){ body_plan_G_Q = document.getElementById('login_body_plan_G_Q').value; body_plan_G_G = document.getElementById('login_body_plan_G_G').value; var login_api_body = body_plan_G_Q+ '*WQRF*' + body_plan_G_G } $.get('/project_login_send/',{ 'login_method':login_method, 'login_url':login_url, 'login_host':login_host, 'login_header':login_header, 'login_body_method':login_body_method, 'login_api_body':login_api_body, 'login_response_set':login_response_set, },function (ret) { $("li a[href=#login_response]").click(); //点击一下返回体按钮 document.getElementById('login_response_body').value = ret ;//把返回值显示到返回值多行文本框中 }) }
代码中注意,增加了返回值提取设置字段:login_response_set
然后我们去urls.py中进行设置:
然后去views.py中进行写好这个比较复杂的方法吧~
我们现在来思考下,这个方法要做什么事?
- 获取前端的数据
- 进行请求,得到返回值
- 对返回值进行提取
- 把提取的结果和返回值一起返回给前端来展示
好现在开始写,由于代码量太大,并且大部分是复制首页发送请求的代码改改,所以大家依然可以复制:
# 调试登陆态接口 def project_login_send(request): # 第一步,获取前端数据 login_method = request.GET['login_method'] login_url = request.GET['login_url'] login_host = request.GET['login_host'] login_header = request.GET['login_header'] login_body_method = request.GET['login_body_method'] login_api_body = request.GET['login_api_body'] login_response_set = request.GET['login_response_set'] # 第二步,发送请求 try: header = json.loads(login_header) #处理header except: return HttpResponse('请求头不符合json格式!') # 拼接完整url if login_host[-1] == '/' and login_url[0] =='/': #都有/ url = login_host[:-1] + login_url elif login_host[-1] != '/' and login_url[0] !='/': #都没有/ url = login_host+ '/' + login_url else: #肯定有一个有/ url = login_host + login_url try: if login_body_method == 'none': response = requests.request(login_method.upper(), url, headers=header, data={} ) elif login_body_method == 'form-data': files = [] payload = {} for i in eval(login_api_body): payload[i[0]] = i[1] response = requests.request(login_method.upper(), url, headers=header, data=payload, files=files ) elif login_body_method == 'x-www-form-urlencoded': header['Content-Type'] = 'application/x-www-form-urlencoded' payload = {} for i in eval(login_api_body): payload[i[0]] = i[1] response = requests.request(login_method.upper(), url, headers=header, data=payload ) elif login_body_method == 'GraphQL': header['Content-Type'] = 'application/json' query = login_api_body.split('*WQRF*')[0] graphql = login_api_body.split('*WQRF*')[1] try: eval(graphql) except: graphql = '{}' payload = '{"query":"%s","variables":%s}' % (query, graphql) response = requests.request(login_method.upper(), url, headers=header, data=payload ) else: #这时肯定是raw的五个子选项: if login_body_method == 'Text': header['Content-Type'] = 'text/plain' if login_body_method == 'JavaScript': header['Content-Type'] = 'text/plain' if login_body_method == 'Json': header['Content-Type'] = 'text/plain' if login_body_method == 'Html': header['Content-Type'] = 'text/plain' if login_body_method == 'Xml': header['Content-Type'] = 'text/plain' response = requests.request(login_method.upper(), url, headers=header, data=login_api_body.encode('utf-8')) # 把返回值传递给前端页面 response.encoding = "utf-8" DB_host.objects.update_or_create(host=login_host) res = response.json() # 第三步,对返回值进行提取 get_res = '' #声明提取结果存放 for i in login_response_set.split('\n'): if i == "": continue else: i = i.replace(' ','') key = i.split('=')[0] #拿出key path = i.split('=')[1] #拿出路径 value = res for j in path.split('/')[1:]: value = value[j] get_res += key + '="' + value +'"\n' # 第四步,返回前端 end_res = {"response":response.text,"get_res":get_res} return HttpResponse(json.dumps(end_res),content_type='application/json') except Exception as e: end_res = {"response":str(e),"get_res":''} return HttpResponse(json.dumps(end_res),content_type='application/json')
注意,上面的最后 我用了一个字典装好数据返回给前端了。前端要进行对应解析。所以回到P_apis.html中,这个js函数的返回处理部分 改成了如下红线格式即可。