浏览器Js调用WebService服务，不局限于IE浏览器

最新推荐文章于 2022-04-10 21:28:35 发布

燃香拜佛

最新推荐文章于 2022-04-10 21:28:35 发布

阅读量443

点赞数

分类专栏： WebService Js

本文链接：https://blog.csdn.net/weixin_38548431/article/details/104377109

版权

WebService 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

1 篇文章 0 订阅

订阅专栏

本地的WebService服务

一、创建调用方法

    [WebService(Namespace = "http://xiaojiayou.com/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消注释以下行。 
    [System.Web.Script.Services.ScriptService]
    public class WebService1 : System.Web.Services.WebService
    {

        [WebMethod]
        public string HelloWorld()
        {
            return "Hello World";
        }

二、配置WebConfig

<?xml version="1.0"?>
<!--
  有关如何配置 ASP.NET 应用程序的详细信息，请访问
  https://go.microsoft.com/fwlink/?LinkId=169433
-->
<configuration>
  <system.web>
    <compilation targetFramework="4.0"/>
    <pages validateRequest="false"/>
    <httpRuntime requestValidationMode="2.0" />
    <webServices>
      <protocols>
        <add name="HttpSoap"/>
        <add name="HttpPost"/>
        <add name="HttpGet"/>
        <add name="Documentation"/>
      </protocols>
    </webServices>
  </system.web>
  <system.webServer>
    <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>
  </system.webServer>
</configuration>

三、Js脚本

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script type="text/javascript" charset="utf-8">
        function RequestWebService() {
            //这是我们在第一步中创建的Web服务的地址
            //var URL = "http://47.106.14.158/WebService/WebService1.asmx";
            var URL = "http://192.168.121.1:8080/WebService1.asmx";
            //在这处我们拼接
            var data;
            data = '<?xml version="1.0" encoding="utf-8"?>';
            data = data + '<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope">';
            data = data + '<soap12:Body>';
            data = data + '<HelloWorld xmlns="http://xiaojiayou.com/" />';
           // data=data+'<GetData xmlns="http://tempuri.org/" />';
            // data=data+'<getSupportCity xmlns="http://WebXml.com.cn/" />';
             //data= data+'<byProvinceName>浙江</byProvinceName>';
            //data= data+'<num>1</num>';
            //data=data+'</getSupportCity>';
            //data=data+'</GetData>';
            data = data + '</soap12:Body>';
            data = data + '</soap12:Envelope>';
            
            //创建异步对象
           // var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

        var xmlhttp;
        try{
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } 
        catch(E){
            try{
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(E){
                 xmlhttp=new XMLHttpRequest(); 
            }
        }

        var URL="http://192.168.1.103:8080/WebService1.asmx";

            xmlhttp.open("POST", URL, false);
            xmlhttp.setRequestHeader("Content-Type", "application/soap+xml");
            xmlhttp.send(data);

            var num1=xmlhttp.responseText;
            var num2=xmlhttp.responseText;

            window.location.href="uniwebview://add?num1="+num1+"&num2"+num2;
            document.getElementById("data").innerHTML = xmlhttp.responseText;
        }      

        function RequestOther(value)
        {
    var data;
        data = '<?xml version="1.0" encoding="utf-8"?>'; 
        data = data + '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">'; 
        data = data + '<soap:Body>'; 
        data = data + '<getSupportCity xmlns="http://WebXml.com.cn/">'; 
        data = data + '<byProvinceName>'+value+'</byProvinceName>'; 
        data = data + '</getSupportCity>'; 
        data = data + '</soap:Body>'; 
        data = data + '</soap:Envelope>'; 

        var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
        var URL="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx";
        xmlhttp.Open("POST",URL, false); 
        xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=utf-8"); 
        xmlhttp.SetRequestHeader ("SOAPAction","http://WebXml.com.cn/getSupportCity"); 
        xmlhttp.Send(data); 
        document.write( xmlhttp.responseText); 
        }  
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="One" type="button" value="JsCallWebService" onclick="RequestWebService()" />
    </div>
    <div id="data">
    </div>
    </form>
</body>
</html>

头一次用Js调Web服务，很费时间，特别是非IE浏览器调用时。1、出现了权限问题，在WebConfig中需要添加参数，看上面的参数表自己缺的对照一下。2、同时ActiveXObject这个类只在IE浏览器中有定义，其他浏览器不支持，需要使用XMLHttpRequest类替换，同时比较坑的是该类中的send()、open()方法区分大小写，头一次知道。