Ajax访问远程WebService 配置文件、编码工作注意

最新推荐文章于 2023-05-05 22:15:29 发布

csdn_peter

最新推荐文章于 2023-05-05 22:15:29 发布

阅读量508

点赞数

分类专栏： WebService 文章标签： webservice ajax远程访问webService webService配置文件

本文链接：https://blog.csdn.net/csdn_peter/article/details/52728403

版权

WebService 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

今天就一次接触webService，走了好多弯路，记录下正确的配置、编码。

一、服务端：

1.webService代码段

// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消注释以下行。
[System.Web.Script.Services.ScriptService]

//方法

[WebMethod(Description ="返回StudentModel实体集合")]
public List<StudentModel> HelloWorld()
{
List<StudentModel> stuList = new List<StudentModel>();
StudentModel stu = new StudentModel()
{
name = "张三",
isMan = true,
age = 10
};
StudentModel stu_1 = new StudentModel(){
name = "李四",
isMan = false,
age = 13
};
stuList.Insert(0, stu);
stuList.Insert(1, stu_1);
return stuList;
}

2..配置文件《很重要！！！》

     <system.web>
      <compilation debug="true" targetFramework="4.0" />
      <httpModules>
          <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" />
      </httpModules>


      <!--运行远程调用的配置-->
      <span style="color:#3366ff;"><webServices>
        <protocols>
          <add name="HttpSoap"/>
          <add name="HttpPost"/>
          <add name="HttpGet"/>
          <add name="Documentation"/>
        </protocols>
      </webServices></span>
      
    </system.web>

<system.webServer>


      <!--运行远程调用的配置-->
      <span style="color:#3366ff;"><httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>
          <add name="Access-Control-Allow-Headers" value="x-requested-with,content-type"/>
          <add name="Access-Control-Allow-Origin" value="*" />
        </customHeaders>
      </httpProtocol></span>


      <validation validateIntegratedModeConfiguration="false" />
        <modules>
            <remove name="ApplicationInsightsWebTracking" />
            <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" />
        </modules>

二、客户端

1.js+html

<script>
    $(function () {
        $("#btnArray").click(function () {
            $.ajax({
                type: "POST",
                contentType: 'application/json',
                url: "http://127.0.0.1:6001/WebService1.asmx/HelloWorld",//http://?jsoncallback=?
                //data: "{'i':10}",//<span style="color:#ff6666;">如果需要参数，变量必须加上''</span>
                dataType:"json",
                success: function (result) {
                    var htmlStr = "";
                    for (var i = 0; i < result.d.length; i++) {
                        htmlStr += "姓名：" + result.d[i].name + "，年龄：" + result.d[i].age + "  ";
                    }
                    alert(htmlStr);
                },
                error: function (xhr, msg) {
                    alert("出错了:"+msg);
                }
            });
        });
    })
</script>

<button id="btnArray">我是GetInt</button>

2.演示效果：

<img src="https://img-blog.csdn.net/20161003162834817?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />

</system.webServer>