使用Rexsee、Jquery、PHP开发移动应用中的数据交互有关问题

WBOY
Freigeben: 2016-06-13 10:29:42
Original
740 Leute haben es durchsucht

使用Rexsee、Jquery、PHP开发移动应用中的数据交互问题

?

Rexsee社区的一篇经验贴,转过来,主要是介绍数据交互这一块的实现,共同学习:

?

在开发某移动销售产品时,用户要求通过WebService调用进行数据交互。使用Rexsee,Jquery-mobile,PHP,WebService几种开发工具可以做到设备调用完成照片、定位等功能,使用Juqery-mobile开发界面,使用PHP+SOAP完成数据库及Webservice的数据交互功能,通过JSON使用PHP将返回数据封装后再返回到前端,这样就做到了数据的异步交互,而且返回结果标准统一,可用性强。下面通过几个例子介绍一下:

登录页面:

?

?

<!DOCTYPE html> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="viewport" content="width=device-width, initial-scale=1">  <title>移动销售</title>  <link rel="stylesheet"  href="../m_jquery-110/jquery.mobile-1.1.0.css" /> <link rel="stylesheet" href="../m_jquery-110/demos/docs/_assets/css/jqm-docs.css"/> <script src="../m_jquery-110/demos/js/jquery.js"></script> <script src="../m_jquery-110/demos/docs/_assets/js/jqm-docs.js"></script> <script src="../m_jquery-110/jquery.mobile-1.1.0.js"></script>  <script src="../m_jquery/demos/jquery.json-2.3.js"></script><STYLE type=text/css>.dotline {BORDER-BOTTOM-STYLE: dotted; BORDER-LEFT-STYLE: dotted; BORDER-RIGHT-STYLE: dotted; BORDER-TOP-STYLE: dotted; color:#FFCCFF}</STYLE><script type="text/javascript">function getCookie(name) { var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)")); if(arr != null) return unescape(arr[2]); return false; } function SetCookie(name,value){ var Days = 30; var exp = new Date(); exp.setTime(exp.getTime() + Days*24*60*60*1000);document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString(); return false;} function onError(data, status){  alert("获取数据失败");  rexseeApplication.quit();   return false;}function onSuccess(data, status){ if (status="sucess") //alert("刷新数据成功!");  mk_data(data,status);  return false;}function mk_data(data,status){  data = $.trim(data);   //alert(data);  var m_sel = $.evalJSON(data).Shop.oper;  //alert(m_sel);  if (m_sel=="getshop")  {  if (data=="{}")  {   alert("登录失败,系统将退出!");   rexseeApplication.quit();     }  else  {  var data1 = $.evalJSON(data).Shop.shopno;  var data2 = $.evalJSON(data).Shop.shopname;  //alert(data1);  var data3 = $("#uname").val();  var data4 = $("#upwd").val(); var m_txt="欢迎您"+ data3 + "\n 部门:" + data1 + data2;  alert(m_txt);  if (data1!="")  {  SetCookie("uname", data3);  SetCookie("ushopno", data1);  SetCookie("ushopname", data2);  SetCookie("upwd", data4);  //window.open ('main.php');    window.location="main.php";  }  } }  return false;} function init(){ var m_v1=$("#uname").val(); var m_v2=$("#upwd").val(); if (m_v1=="") {  alert("请输入号码!");  return false; } if (m_v2=="") {  alert("请输入密码!");  return false; } $("#oper").val('getshop'); var formData = $("#loginForm").serialize(); $.ajax({   type: "POST",   url: "func_soap.php",   cache: false,   data: formData,   success: onSuccess,   error: onError    }); return false;}$(document).ready(function() {  rexseeScreen.setScreenOrientation('portrait'); rexseeStatusBar.setStyle('visibility:hidden;'); var m_s1=rexseeTelephony.getDeviceId();  var m_s2=getCookie('uname');   var m_s3=getCookie('upwd');   $("#uname").val(m_s2);  $("#upwd").val(m_s3);  $("#mylogin").click(function(){     //alert("fdjsaf");  init(); }) return false;});</script></head><body><form  name="loginForm" id="loginForm" method="POST" target="_self" action="javascript:void(0);" > <input type="hidden" name="oper" id="oper" size="36" value="" readonly> <div data-role="page" class="type-interior" id="album-list">    <div data-role="header" class="footer-docs" data-theme="b">        <h1><img  src="images/logo4.png" / alt="使用Rexsee、Jquery、PHP开发移动应用中的数据交互有关问题" ></h1>       </div> <!-- /header --> <div data-role="content">  <div class="content-primary">   <p></p>    <div class="ui-body ui-body-c">  <div class='ui-grid-a' id=saleinfo>  <div class='ui-block-a'   style="max-width:90%"><label for='dd_sid'>手机号码</label></div><div class='ui-block-b'></div>  <div class='ui-block-a' style='width:180px'><input type='text' name='uname' id='uname' value='18658269081'  /></div><div class='ui-block-b'></div>  <div class='ui-block-a' style='width:180px'><label for='dd_sid'>登录密码</label></div><div class='ui-block-b'></div>  <div class='ui-block-a' style='width:180px'><input type='password' name='upwd' id='upwd' value=''  /></div><div class='ui-block-b'></div>      <p></p>    <p></p>   </div>     </div>    <a id="mylogin" href="javascript:void(0);" data-role="button" data-theme="e"  data-icon="check">登录系统</a>    <p><img  border="0" src="images/back.png"  alt="使用Rexsee、Jquery、PHP开发移动应用中的数据交互有关问题" ></p>   <p></p>     </div>  </div><!-- /content --> <div data-role="footer" class="footer-docs" data-theme="b" data-position="fixed">   <p>CopyRight&copy; Chinaunicom Jinan 2012 All Right Reserved. </p> </div>  </div><!-- /page --></form></body></html>
Nach dem Login kopieren
?

?

以上页面通过Jquery-mobile显示一个登录页面,点击提交后异步调用func_sap函数完成WebSerivce调用及返回,返回数据以JSON形式,通过javascript的json函数将数据提取并处理。

func_soap.php文件<?phpfunction getshop($phone){$wsdl = "http://.../Service.asmx?wsdl";$soap_client = new SoapClient($wsdl);$param=array( 'phone'=> $phone); $objectresult = $soap_client->AgetShop($param);$simpleresult = $objectresult->AgetShopResult; $obj = simplexml_load_string($simpleresult);$obj->Shop[0]->addChild("oper", "getshop");$json = json_encode($obj);$array = json_decode($json,TRUE); $_SESSION['shopno']= $array["Shop"]['shopno'];$_SESSION['phone']=$phone;return $json;}//调用函数header("Content-Type:text/html;charset=utf-8");$moper=$_POST['oper']; if ($moper=="getshop"){$mresult=getshop($muname);echo $mresult;}?>
Nach dem Login kopieren

?原文链接:http://www.rexsee.com/CN/bbs/thread/2012-04-29/556.html

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage