2

私は2つのアプリを持っています。1つはWCFサービス、2つ目はasp.netMVC3アプリです。
WCFアプリには、次のインターフェイスがあります。

    [ServiceContract]
    public interface IService1
    {
        [OperationContract]
        string HelloWorld(string personName);
    }

そしてクラス:

public class Service1 : IService1
    {
        public string HelloWorld(string personName)
        {
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            return serializer.Serialize("Hello " + personName);
        }
    }

さて、asp.net mvcアプリで、Ajaxを介してこのメ​​ソッドを呼び出したいと思います。

<script type="text/javascript">
    var personName = "John";
    var dataIn = '{' + '"input":"' + personName + '"}';
    $.ajax({
        url: "http://localhost:7215/Service1.svc/HelloWorld",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        data: dataIn,
        dataType: "json",
        success: function (data) {
            var object = JSON.parse(data.d);
            if (object.Error == '') {
                $("#response").html(object);
            }
        },
        error: function (error) {
            alert("Error: " + error);
        }
    });
    </script>

しかし、Firebugではエラーが発生します:400 Bad Request。メソッドを正しく
呼び出す方法は?HelloWorldありがとう。

4

2 に答える 2

12

JavaScriptからWCF サービスを利用しようとしていますか?

私が目にする最初の問題は、あなたのサービスはまだ JavaScript から利用する準備ができていないということです :(. 次の変更を行う必要があります..

  1. Service1動作を使用してクラスを構成しAspNetCompatibilityRequirementsます。

  2. HelloWorld属性とのインターフェイスでサービス メソッドをマークしWebGetます。System.SericeModel.Web【組み立ての参考書が必要】

2つの変更を行った後..

[ServiceContract]
public interface IService1
{
  [OperationContract]
  [WebGet(ResponseFormat = WebMessageFormat.Json)]
  string HelloWorld(string personName);
}

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class Service1 : IService1
{
  public string HelloWorld(string personName)
  {
    JavaScriptSerializer serializer = new JavaScriptSerializer();

    // you are not returning data in proper JSON format, wrap the text in
    // an anonymous object before serializing.
    return serializer.Serialize(new { text = "Hello " + personName });
  }
}

次..

  1. サービスを構成webHttpBindingします (サービス名とコントラクト名を必ず変更してください!)。

    <system.serviceModel>
      <behaviors>
        <endpointBehaviors>
          <behavior name="webHttpBehavior">
            <webHttp />
          </behavior>
        </endpointBehaviors>
      </behaviors>
      <bindings>
        <webHttpBinding>
          <binding name="webHttpBindingWithJsonP" />
        </webHttpBinding>
      </bindings>
      <services>
        <service name="MvcApplication3.Service1">
          <endpoint address="" binding="webHttpBinding"
                    bindingConfiguration="webHttpBindingWithJsonP"
                    contract="MvcApplication3.IService1"
                    behaviorConfiguration="webHttpBehavior"/>
        </service>
      </services>
    </system.serviceModel>
    

これでサービスの準備が整いました!

クライアント側で変更を行いましょう (サービスからデータを取得しているのに、なぜPOSTなのですか?)

  <script type="text/javascript">
      var personName = "John";
      var dataIn = '{' + '"input":"' + personName + '"}';
      $.ajax({
         url: "http://localhost:50623/Service1.svc/HelloWorld",
         type: "GET",
         contentType: "application/json; charset=utf-8",
         data: dataIn,
         dataType: "json",
         success: function (data) {
           var jsonData = JSON.parse(data);
           $("#response").html(jsonData.text);
         },
         error: function (error) {
           alert("Error: " + error);
         }
      });
   </script>

ここまでは、WCF サービスと MVC アプリの両方が同じドメインで実行されていると想定してきました。

しかし、そうでない場合は、CROSS-DOMAIN BARRIERが原因で405(Method Not Allowed)エラーが発生します。

この問題を解決するには、さまざまな方法があります。

1.JSONP を使用する

この場合、バインディングでcrossDomainScriptAccessEnabledプロパティを設定するtrue必要があり、jQuery から JSONP 呼び出しを行う必要があります。

<binding name="webHttpBindingWithJsonP" crossDomainScriptAccessEnabled="true" />

次に、メソッドでdataTypefrom"json"を "に変更します。jsonp"$.ajax

  <script type="text/javascript">
      var personName = "John";
      var dataIn = '{' + '"input":"' + personName + '"}';
      $.ajax({
         ...
         dataType: "jsonp",
         ...
      });
   </script>

2. CORS の使用

これを参照してください..

http://www.w3.org/TR/cors/

https://developer.mozilla.org/en/http_access_control

于 2012-05-26T14:07:23.190 に答える
3

最初に確認する必要があるのは、ブラウザに組み込まれているのと同じオリジンポリシーに違反していないことです。このポリシーにより、クロスドメインAJAXリクエストを送信できなくなります。2つのアプリケーションがあるとおっしゃっていたので、たとえば最初のアプリケーションがホストされていてhttp://localhost:1234/(javascriptファイルを含むアプリケーション)、AJAXリクエストをhttp://localhost:7215/(同じドメイン、異なるポート=>同一生成元ポリシーに違反しています)。

いくつかの回避策があります。それらの1つは、JSONの代わりにJSONP応答を送信するようにサービスを構成することです。これは、MSDNのサンプルWCF​​サービスアプリケーションであり、構成方法を示しています。基本的に、このブログ投稿crossDomainScriptAccessEnabledに示されているように、スイッチを有効にする必要があります。

于 2012-05-26T07:08:18.273 に答える