开发者社区> 暖枫无敌> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

asp.net WebService实现跨域js调用功能实现

简介: 1、Web.Config中增加如下红色标记部分配置:                                                               2、增加一...
+关注继续查看

1、Web.Config中增加如下红色标记部分配置:

<system.web>
    <compilation debug="true" targetFramework="4.0" />
    <!--提供Ajax调用开始 -->
    <webServices>
        <protocols>
            <add name="HttpGet" />
            <add name="HttpPost" />
        </protocols>
    </webServices>
    <!--提供Ajax调用结束-->

  </system.web>


2、增加一个Tools类,如下代码:

    public class Tools
    {
          public static void WriteResult(string callback, string result)
          {
               HttpContext.Current.Response.HeaderEncoding = System.Text.Encoding.UTF8;
               HttpContext.Current.Response.ContentEncoding = System.Text.Encoding.UTF8;
               HttpContext.Current.Response.Write(callback + "(" + result + ")");
               HttpContext.Current.Response.End();
          }
    }


3、WebService文件增加头属性


    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消注释以下行。 
    [System.Web.Script.Services.ScriptService]
    [SoapDocumentService(RoutingStyle = SoapServiceRoutingStyle.RequestElement)]

    public class getData : System.Web.Services.WebService
    {

        #region 1、获取设备信息

        [WebMethod]
        public void GetAllDeviceData()
        {
            string sql = @"select devid,jfid,devname from JfDevice";
            DataTable dtTable = AosySql.ExecuteforDataSet(sql).Tables[0]; //获取数据库数据的方法,使用的数据库访问类,根据自身情况调整
            StringBuilder sb = new StringBuilder();
            if (dtTable.Rows.Count > 0)
            {
                foreach (DataRowView drv in dtTable.DefaultView)
                {
                    sb.Append("{\"DevId\":\"" + drv["devid"].ToString() + "\",");
                    sb.Append("\"DevName\":\"" + drv["devname"].ToString() + "\",");
                    sb.Append("\"JfId\":\"" + drv["jfid"].ToString() + "\"},");
                }
            }
            string result = "[" + sb.ToString().TrimEnd(',') + "]";
            Tools.WriteResult(HttpContext.Current.Request["jsoncallback"], result);
        }

   }


4、将WebService发布到IIS后,在其他系统中的html页面中调用,如下代码所示:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="JS/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
        $(function () {
            getValueFromWebService();
        });

        //查询webservice
        function webservice(url, callback) {
            $.ajax({
                type: 'get',
                url: url,
                dataType: 'jsonp',
                jsonp: 'jsoncallback',
                success: function (result) {
                    callback(result);
                }
            });
        };


        function getValueFromWebService() {
            webservice('http://192.168.33.158/XXXX/WebService/getData.asmx/GetAllDeviceData',
                function (obj) {
                    var data = obj;
                    //成功
                    $.each(data, function (key, item) {
                        // 添加项目内容到ul列表中
                        $('<li>', { text: formatItem(item) }).appendTo($('#room'));
                    });
                });
        }

        function formatItem(item) {
            return item.DevId + ' /  ' + item.DevName + ' / ' + item.JfId;
        }
    </script>
</head>
<body>
    <ul id="room">
    </ul>
</body>
</html>


版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
javascript 中ondragstart ondrag实现拖动界面元素效果 .
function showpos()  {     document.all.x.value = event.clientX;     document.all.y.value = event.
593 0
零起点 Asp.net中使用javaScript实现前后台方法的相互调用
零起点 Asp.net中使用javaScript实现前后台方法的相互调用 一、前台调用后台的方法: 1、在后台编写你要调用到前台的方法,如下:   public string str()//javaScript函数中执行C#代码中的函数 { retur...
582 0
Javascript中利用window.event.keyCode 实现金融文本框禁用非法输特效!
主要就是为了监听键盘按下的是哪个键,并且转成ASCII码;   DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.
594 0
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
兼容:IE7以上版本及FF;(腾讯的WebQQ3.0好像也不兼容IE6,其实这样挺好的)   上图片素材先:   背景图片: 浮云图片:    ←——————————这里是有图片D~  全选就能看见了(因为背景是白的,云也是白的嘛~)……   CSS代码:         ...
995 0
Javascript特效实现鼠标移动到小图,查看大图效果;
首先感谢“杨中科”老师,免费发布教学视频; 老规矩,先上传图片素材;一共六张图片,三大,三小(大的图片大家可以把他下载下来,当成手机屏保哦,由于图片太大,我只让他显示200*300了)。   小图片都是通过document.
576 0
javascript实现二级联动下拉框
这个是简单也是最基本的下拉框联动的示例,这个示例主要针对那些只有二级联动,且第一级是固定的选项,第二级的内容也比较简单。这里使用了javascript来联动第二级下拉框。  1 DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 2  3  4  New Document  5  6  7  8  9 10     //定义了城市的二维数组,里面的顺序跟省份的顺序是相同的。
967 0
网络之美:JavaScript中Get和Set访问器的实现
  前两天IE9 Beta版发布了,对于从事Web开发的朋友们来说真是个好消息啊,希望将来有一天各个浏览器都能遵循统一的标准。今天要和大家分享的是JavaScript中的Get和Set访问器,和C#中的访问器非常相似。
495 0
javascript 表达式、括号、常用函数和jquery库怎么样实现的分析
(一)javascript表达式 表达式是什么?表达式是对变更进行赋值、更改或计算等操作的语句。它是变量、常量、操作符的综合。根据操作符的不类型,可以分为字符操作表达式、赋值表达式、逻辑表达式、关系表达式、自增自减表达式、位表达式等。
604 0
+关注
文章
问答
文章排行榜
最热
最新
相关电子书
更多
编程语言如何演化—— 以 JS 的 private 为例
立即下载
JS 语言在引擎级别的执行过程
立即下载
Python第五讲——关于爬虫如何做js逆向的思路
立即下载