1

我正在创建一个 WCF 服务，该服务将由客户端的纯 JavaScript 和客户端的一些 jQuery JavaScript 使用。

1) 我怎样才能实现普通的客户端 JavaScript，以便它以这样的方式调用 WCF 服务，以便立即检索 System.IO.Stream 的集合？此外，我将如何遍历在纯 JavaScript 端接收到的集合，以便可以将集合中的每个 System.IO.Stream 对象与 HTML 图像元素相关联？

2) 是否有可能实现使用 jquery 的 JavaScript 代码，以便它以这样的方式调用 WCF 服务，即一次检索 System.IO.Stream 的集合？此外，我将如何遍历使用 jQuery 的 JavaScript 接收的集合，以便可以将集合中的每个 System.IO.Stream 对象与 HTML 图像元素相关联？

 /*********Start of Excerpt from the Interface Code of a WCF Service 

  Contract*****************/ 

  using System; 

  using System.Collections.Generic; 

  using System.Linq; 

  using System.Runtime.Serialization; 

  using System.ServiceModel; 

  using System.ServiceModel.Activation; 

  using System.Text; 

  using System.ServiceModel.Web; 

  using System.IO; 

  using ConsoleForWCFServiceTutorial.PerlsDataContracts; 

  using ConsoleForWCFServiceTutorial.DataAccessObjectsDAO; 


  namespace ConsoleForWCFServiceTutorial 

  { 

     [ServiceContract(Namespace = 

  "http://ConsoleForWCFServiceTutorial.CarService")] 

     public interface ICarService 

     { 

    [OperationContract] 

    [WebInvoke(Method = "GET", 

                    BodyStyle = WebMessageBodyStyle.WrappedRequest)] 

         Stream[] getImagesList(); 




     } 

  } 

  /*********End of Excerpt from the Interface Code of a WCF Service 
  Contract*****************/ 




  /*********Start of Excerpt of the code associated with the Class that 
  implements the WCF Service Contract*****************/ 

  using System; 
  using System.Collections.Generic; 
  using System.Linq; 
  using System.Text; 
  using System.Collections; 
  using System.ServiceModel.Activation; 
  using System.Configuration; 
  using System.Data; 
  using System.IO; 
  using System.ComponentModel; 
  using ConsoleForWCFServiceTutorial.PerlsDataContracts; 
  using ConsoleForWCFServiceTutorial.DataAccessObjectsDAO; 


  namespace ConsoleForWCFServiceTutorial 
  { 
       [AspNetCompatibilityRequirements(RequirementsMode = 
       AspNetCompatibilityRequirementsMode.NotAllowed)] 
  class CarService : ICarService 
  { 

        public Stream[] getImagesList() 
         { 


             List<Stream> myImagesList = new List<Stream>(); 

             string fileName = Path.Combine("BMWpicture.jpg"); 

             FileStream fileStream = 
               new FileStream(fileName, FileMode.Open, FileAccess.Read); 
             // Set the content type as image/ jpeg 
             System.ServiceModel.Web.WebOperationContext. 
               Current.OutgoingResponse.ContentType = "image/jpeg"; 


             myImagesList.Add(fileStream); 

             string fileName2 = Path.Combine     ("MercedesBenzpicture.jpg"); 

             FileStream fileStream2 = 
          new FileStream(fileName2, FileMode.Open, FileAccess.Read); 
             // Set the content type as image/ jpeg 
             System.ServiceModel.Web.WebOperationContext. 
               Current.OutgoingResponse.ContentType = "image/jpeg"; 


             myImagesList.Add(fileStream2); 

             return myImagesList.ToArray(); 
         } 
     } 
  } 
  /*********End of Excerpt of the code associated with the Class that 
  implements the WCF Service Contract*****************/ 


  <!--Start of Excerpt of the plain JavaScript client code that 
  invokes one of the Methods in the WCF Service 
  Contract--> 

  <script type="text/javascript"> 

  function getImagesList2() { 

    var listOfStreams = 
  'http://localhost:8732/Design_Time_Addresses/ConsoleForWCFServiceTutorial/c     arService     /getImagesList' 

    document.getElementById("image11").onload = function () { 
      }; // img.onload = function() 


  document.getElementById("image11").src = listOfStreams[0]; 



    document.getElementById("image12").onload = function () { 
         }; // img.onload = function() 


       document.getElementById("image12").src = listOfStreams[1]; 

  } 
  </script> 
  <!--End of Excerpt of the plain JavaScript client code that 
  invokes one of the Methods in the WCF Service 
  Contract--> 

  <!--Start of Excerpt of the HTML code that is affected by the 
  JavaScript client and WCF Service interaction--> 
  <body> 
     <form id="form1" runat="server"> 
     <div> 


                  <img src=""  id="image11" alt="Smiley face" />      

                <img src=""  id="image12" alt="Smiley face" /> 


          <br /> 
          <a class="large blue button" id="A7" 
  onClick="getImagesList2()">getImagesList2</a> 


         </div> 
     </form> 
  </body> 
  </html> 

  <!--End of Excerpt of the HTML code that is affected by the 
 JavaScript client and WCF Service interaction-->

1) 我怎样才能实现普通的客户端 JavaScript，以便它以这样的方式调用 WCF 服务，以便立即检索 System.IO.Stream 的集合？此外，我将如何遍历在纯 JavaScript 端接收到的集合，以便可以将集合中的每个 System.IO.Stream 对象与 HTML 图像元素相关联？

2) 是否有可能实现使用 jquery 的 JavaScript 代码，以便它以这样的方式调用 WCF 服务，即一次检索 System.IO.Stream 的集合？此外，我将如何遍历使用 jQuery 的 JavaScript 接收的集合，以便可以将集合中的每个 System.IO.Stream 对象与 HTML 图像元素相关联？

4

1 回答 1

1

您要求的内容在您指定的方案中使用并没有真正意义。您已经在获取图像的 URL，只需发送路径数组，然后在客户端上构建图像。您的页面上有 jQuery，因此 Ajax 请求就足够简单了。像这样的事情应该可以推动您朝着正确的方向前进：

// return this from the server:
{ "data" : [ "path/to/image1.jpg", "path/to/image2.jpg" ] }

// then consume in your response on the client side:
$.ajax({
    url: 'http://localhost:8732/Design_Time_Addresses/ConsoleForWCFServiceTutorial/carService/getImagesList',
    dataType: 'json',
    type: 'post',
    success: function (response) {
        var container = $("<div/>");
        $.each( response.data, function (value, index) {
            container.append("<img src='" + value "' />");
        });

        container.prependTo("#form1");
    }
});
于 2012-05-02T18:24:41.933 回答