引言

随着手机及移动设备的普及,移动端的应用也进入了热潮。以前PC端的门户网站,大多也均推出了适配移动设备的网站或者APP,再差的也注册了个公众号。在移动应用开发中,目前据我所了解到的解决方案有:1、原生态APP开发;2、适配移动设备的JS+HTML网站,套上跨平台的“马甲”;3、微信小程序及公众号(其实和第2点一样,套了微信的壳)。其中运用JS+HTML的应用占据大部分,这个比例是多少我没有统计和查询相关数据,反正就是很多吧。而JS+HTML移动开发中,大多采用的框架是,前端页面加上WebService。因此,引出我们今天要说的话题:ajax调用handler,使用HttpWebRequest访问WCF服务。说了这么多,其实就是想表明:现在移动开发很热,大家都采用“JS+HTML+WebService+套娃”这种架构,我分享的这个是给大家在这种架构中开发,提供一个解决方案。还是大白话适合我,不过偶尔也要装装逼,吹吹现在的互联网+时代。

正文

言归正传,移动应用的开发采用 “JS+HTML+WebService+套娃”架构,以下均简称这种架构,前端通过JS(JQuery、React等等)和HTML进行呈现和业务操作,再通过ajax请求后台服务数据,服务端以API形式开发接口(WebService、WCF等等)。.net平台中,服务端采用WCF提供API接口,是不错的选择。出于安全考虑,服务端一般不直接开放给客户端直接调用,客户需通过web服务器,中转调用webservice。中转的程序只写一次就可以了,我这里采用了一般处理程序handler。

首先,客户端通过ajax调用handler:

function Commit1() {
var req = {};
req.Name = "测试1";
req.Age = "30";
var dvalue = JSON.stringify(req);
var para = { action: "GetPersonDetail", data: dvalue };
ajaxWCFService(para, false, CommitSuc);
} function CommitSuc(data) {
data = $.parseJSON(data);
alert("Name:" + data.Name + ",Age:" + data.Age);
} //调用服务接口
function ajaxWCFService(param, async, sucFunc) {
var hUrl = document.URL;
var pathName = document.location.pathname;
var pos = hUrl.indexOf(pathName);
var url = hUrl.substring(0, pos);
url += "/handle/BaseHandler.ashx"; $.ajax({
type: "post",
url: url,
data: param,
async: async,
success: sucFunc
});
}

Handler做为中转,只开放给网站服务端,对客户端不开放,通过HttpWebRequest访问服务端,我这里采用了WCF:

public void ProcessRequest(HttpContext context)
{
string action = context.Request["action"];
string Data = context.Request["data"];
//Data = "Name=testc&Age=30";
string url = "http://localhost:28380/Service1.svc/" + action; //获取服务端返回信息
string result = postSend(url, Data);
context.Response.Write(result);
} public string postSend(string url, string param)
{
Encoding myEncode = Encoding.GetEncoding("UTF-8");
byte[] postBytes = Encoding.UTF8.GetBytes(param); HttpWebRequest req = (HttpWebRequest)HttpWebRequest.Create(url);
req.Method = "POST";
req.ContentType = "application/x-www-form-urlencoded;charset=UTF-8";
req.ContentLength = postBytes.Length;
try
{
using (Stream reqStream = req.GetRequestStream())
{
reqStream.Write(postBytes, 0, postBytes.Length);
} using (WebResponse res = req.GetResponse())
{
using (StreamReader reader = new StreamReader(res.GetResponseStream()))
{
string result = reader.ReadToEnd();
return result;
}
}
}
catch (WebException ex)
{
HttpWebResponse res = (HttpWebResponse)ex.Response;
StreamReader reader = new StreamReader(res.GetResponseStream());
string result = reader.ReadToEnd();
string IsSucceed = "false";
string ErrorMsg = "Hander:" + ex.Message + " StackTrace:" + ex.StackTrace+"\r\n ErrorResponse:" + result;
var success = new { IsSucceed, ErrorMsg };
return JSONHelper.ToJSON(success);
}
}

接着,WCF服务端首先是契约定义:

[OperationContract]
[WebInvoke(UriTemplate = "GetPersonDetail", Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)]
Stream GetPersonDetail(Stream req);

WCF方法的实现:

        public Stream GetPersonDetail(Stream stream)
{
StreamReader sr = new StreamReader(stream);
string s = sr.ReadToEnd();
sr.Dispose();
JObject jo = JObject.Parse(s);
string Name = jo["Name"].ToString();
string Age = jo["Age"].ToString(); var result = new Person()
{
IsSucceed = true,
Name = "Service Back:" + Name,
Age = "Service Back:" + Age
};
return new MemoryStream(Encoding.UTF8.GetBytes(JsonConvert.SerializeObject(result)));
}

至此,“JS+HTML+WebService+套娃”框架基本完成,后面就是添砖加瓦的工作的,只需要写JS页面操作及WCF数据访问即可。

好了今天就写到这,如果这篇文章对你有所帮助,请推荐一下!欢迎转截,请注明出处!

ajax调用handler,使用HttpWebRequest访问WCF服务的更多相关文章

  1. 客户端使用自定义代理类访问WCF服务 z

    通常在客户端访问WCF服务时,都需要添加服务引用,然后在客户端app.config或 web.config文件中产生WCF服务的客户端配置信息.若是每添加一个服务都是这样做,这样势必会将比较麻烦,能否 ...

  2. 客户端使用自定义代理类访问WCF服务

    通常在客户端访问WCF服务时,都需要添加服务引用,然后在客户端app.config或web.config文件中产生WCF服务的客户端配置信息.若是每添加一个服务都是这样做,这样势必会将比较麻烦,能否简 ...

  3. Android访问WCF服务(使用json实现参数传递)

    经过多日努力, 终于勉强弄明白了Android访问WCF服务的方法. 服务端实现 一, 实现服务. 操作契约 [ServiceContract] public interface IService { ...

  4. Ajax跨域访问wcf服务中所遇到的问题总结。

    工具说明:vs2012,sql server 2008R2 1.首先,通过vs2012建立一个wcf服务项目,建立好之后.再新开一个vs2012 建立web项目,通过jQuery的ajax方法访问服务 ...

  5. Wince 中访问WCF服务

    由于本文并非WinCE开发普及篇,所以一些WinCE开发和WCF开发的基础还请移步百度和谷歌寻找答案,然后结合本文开发出WinCE中如何访问WCF,谢谢. 开发环境 IDE:Visual Studio ...

  6. Android访问WCF服务

    原文链接:http://www.cnblogs.com/VinC/archive/2011/02/24/1964049.html 本章目的: 用Wcf建立可以上Android可以访问的数据服务, 数据 ...

  7. 快速访问WCF服务--ServiceModel 元数据实用工具 (Svcutil.exe)

    基本定义 ServiceModel 元数据实用工具用于依据元数据文档生成服务模型代码,以及依据服务模型代码生成元数据文档. SvcUtil.exe ServiceModel 元数据实用工具可在 Win ...

  8. 三种客户端访问wcf服务端的方法 C#

    原文 http://blog.csdn.net/zlj002/article/details/7914556 string jsonstr = String.Empty; string url = & ...

  9. 解决android调用IIS Express中的WCF服务时,出现错误400问题

    IIS Express仅支持localhost主机名地址访问. 找到IIS Express Config文件下的 applicationhost.confi   修改配置 再来调试android应用, ...

随机推荐

  1. vue-router自动判断左右翻页转场动画

    前段时间做了一个移动端spa项目,技术基于 :vue + vue-router + vuex + mint-ui 因为使用了vue-cli脚手架的webpack模版,所有页面都以.vue为后缀的文件作 ...

  2. php备份数据库类分享

    本文实例讲述了php实现MySQL数据库备份类.分享给大家供大家参考.具体分析如下:这是一个非常简单的利用php来备份mysql数据库的类文件,我们只要简单的配置好连接地址用户名与数据库即可   ph ...

  3. 什么是WEBserver? 经常使用的WEBserver有哪些?

    地址:http://www.mamicode.com/ 什么是WEBserver? 经常使用的WEBserver有哪些? 一.什么是WEBserver Webserver能够解析HTTP协议.当Web ...

  4. 怎么解决dede首页网址自动加上index.html

    怎样去掉dedecms5.7(织梦)首页url后index.html有三种方法 1.去配置你的空间的默认首页地址.把index.html移到默认文本最前面.(确保你的默认文档里面有index.html ...

  5. 一步步部署基于Windows系统的Jenkins持续集成环境

    如题:本文将介绍如何在Windows环境下运用Jenkins部署持续集成环境.之所以写本文,是因为在最近工作当中,学习使用Jenkins时,确实遇到了一些问题,而大多数教程文档都是基于Mac或是Lin ...

  6. 深入浅出docker

    笔者在海外工作多年,所以文中多用英文单词,有些时候是为了更精准的描述,请见谅.希望这篇随笔能帮大家入门docker.由于在海外连博客园有些慢,所以我图片用的比较少,以后再考虑一下如何更好的解决图片上传 ...

  7. mysql-innoDB-锁

    在InnoDB加锁前,为什么要先start transaction innodb下锁的释放在事务提交/回滚之后,事务一旦提交/回滚之后,就会自动释放事务中的锁,innodb默认情况下autocommi ...

  8. TypeError: 'encoding' is an invalid keyword argument for this function

    python 2.7 问题 data_file = open("F:\\MyPro\\data.yaml", "r", encoding='utf-8') 运行 ...

  9. .net Core学习笔记3 编辑列表并绑定下拉列

    本次主要实现列表的编辑及下拉列表的绑定 先看效果图: 主要用DropDownList绑定下拉列后端代码: 1:定义一个存下拉数据类 public class SelectItem { public s ...

  10. 使用express+multer实现node中的图片上传

    使用express+multer实现node中的图片上传 在前端中,我们使用ajax来异步上传图片,使用file-input来上传图片,使用formdata对象来处理图片数据,post到服务器中 在n ...