记录一下页面与客户端交互的心酸
来源:互联网 发布:p57数据是bin还是dat 编辑:程序博客网 时间:2024/05/16 00:44
1、先介绍一下得力帮手:fiddler4,使用fiddler做代理调试手机页面,设置方法:
建议连接同一个局域网,即同一个wifi
一、查看pc端无线网络连接ip, 无线网络连接,无线网络连接,ipv4地址,这里是192.168.*.*
二、设置fildder4
三、设置手机网络代理,
此时fiddler即可监控手机网络请求!
2、利用WebViewJavascriptBridge实现网页也客户端交互,网页引用js即可:
此文件必须放在最顶层页面,如页面包含有iframe,此js文件必须放在iframe所在页面
// 安卓端function connectWebViewJavascriptBridge(callback) { if (window.WebViewJavascriptBridge) { callback(WebViewJavascriptBridge) } else { document.addEventListener( 'WebViewJavascriptBridgeReady' , function() { callback(WebViewJavascriptBridge) }, false ); }}// iOS端function setupWebViewJavascriptBridge(callback) { if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); } if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); } window.WVJBCallbacks = [callback]; var WVJBIframe = document.createElement('iframe'); WVJBIframe.style.display = 'none'; WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__'; document.documentElement.appendChild(WVJBIframe); setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)}var u = navigator.userAgent;if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) { connectWebViewJavascriptBridge(function(bridge) { //document.getElementById("show").innerHTML = "android WebViewJavascriptBridge inited" })} else { setupWebViewJavascriptBridge(function(bridge) { //document.getElementById("show").innerHTML = "iOS WebViewJavascriptBridge inited" })}
之后即可使用以下方法调用客户端方法:
window.WebViewJavascriptBridge.callHandler( 'openTakePhoto' , '9999999' , function(responseData) { document.getElementById("content").contentWindow.photoHandler(responseData); } );
img base64 to blob
function dataURLtoBlob(dataurl) { var arr = dataurl.split(','); mime = arr[0].match(/:(.*?);/)[1]; bstr = atob(dataurl.substr(22).replace(/\s/g, '')); n = bstr.length; u8arr = new Uint8Array(n); while (n--) { u8arr[n] = bstr.charCodeAt(n); } return new Blob([u8arr], { type: mime });}
dataurl 包含:data:image/png;base64,
由于是带文件上传用到:new FormData();
function doTest() {var dataHandlerTime = new Date().getTime();var params = getParams();if(!params){return;}var url = $("#url").val();var data = new FormData();var dataWithType = new Blob([JSON.stringify(params)], { type: "application/json"});data.append("data",dataWithType);var img = $("#photos_table_div li").children("img.sel-photo");if(img){var imgLength = img.length;for(var i=0;i<imgLength;i++){var imgSrc = $(img[i]).attr("src");var blobBin = dataURLtoBlob(imgSrc);var ext = blobBin.type.split("/");var imgName = new Date().getTime();data.append('file',blobBin,imgName+"."+ext[1]);//base64不包含文件名,这里设置文件名}}//data.append('file', $('#testimg').prop('files')[0]) input file 设置方式$.ajax({url : url,type : 'post',processData :false,contentType: false,data : data,dataType : 'json',success : function(data){var obj = eval(data);if(obj.responseCode == '0'){}},error: function (jqXHR, textStatus, errorThrown) { alert(textStatus+"---"+errorThrown); }});}
0 0
- 记录一下页面与客户端交互的心酸
- 记录一下这五天的学习mini2440。心酸呀
- 通过WebView实现页面与ANDRIOD客户端的交互
- 客户端与服务器的交互
- 记录一下oracle客户端与远程服务器的连接配置过程
- Html页面与页面间的交互
- 记录一下webservoce的客户端以及服务端的总结
- TCP客户端与服务器的交互过程
- DWR之与客户端的DWR交互
- 实现客户端与服务器的交互
- 浏览器客户端与服务器的交互过程
- 浏览器客户端与服务器的交互过程
- 手机App客户端与服务器端的交互
- 关于服务器端与客户端的交互
- android客户端与服务器端的简单交互
- 客户端与服务器接口的交互。
- Fresco之客户端与服务端的交互
- Android客户端与服务端的交互方式
- 关于赋值重载函数
- 无法安装VMware tools?解决方法
- HDU1029 Ignatius and the Princess IV 腾讯面试题抢红包(?)(模拟)
- View的绘制流程
- 第六篇:工厂模式
- 记录一下页面与客户端交互的心酸
- The.Great.Pharaoh.v1.0.2-TE\
- 如果后台的Activity由于某种原因被系统回收了,如何在被系统回收之前保存当前状态?
- 反射的基本原理
- 在mac系统下配置环境变量
- ListView中item点击事件和item中radiobutton的点击editText输入焦点问题
- 【数据分析】图书馆数据-01建表
- 【Android】View事件分发思维导图
- The Solution to LeetCode 15 3Sum