jQuery を使用してクロス ドメイン WCF REST サービスを使用するには、以下のサンプルを見つけてください。
私のサービスは次のようになります。
[ServiceContract]
public interface IJSONPService
{
[OperationContract]
[WebGet]
string GetDate();
[OperationContract]
[WebInvoke]
string PostData(string name);
}
上記のサービスの構成エントリは次のようになります。
<services>
<service name="Service.JSONPService">
<endpoint address="" binding="webHttpBinding" behaviorConfiguration="json" bindingConfiguration="defaultRestJsonp" contract="Service.IJSONPService">
</endpoint>
</service>
</services>
<behaviors>
<endpointBehaviors>
<behavior name="json">
<enableWebScript />
</behavior>
</behaviors>
</endpointBehaviors>
<webHttpBinding>
<binding name="defaultRestJsonp" crossDomainScriptAccessEnabled="true">
<readerQuotas maxStringContentLength="2147483647" maxArrayLength="2147483647" maxBytesPerRead="2147483647" maxDepth="64" maxNameTableCharCount="2147483647" />
<security mode="None" />
</binding>
</webHttpBinding>
crossDomainScriptAccessEnabled
バインディング要素「defaultRestJsonp」の属性に注意する必要があります。これは、リクエストが JSONP 用であると判断し、クエリ文字列として来る URL からのコールバック メソッドにラップされるレスポンスを適切に変換します。
次に、ページから、上記の WCF REST サービスを呼び出す以下の JavaScript を実行します。
function TestingWCFRestWithJsonp() {
$.ajax({
url: "http://domain.com/Service/JSONPService.svc/GetDate",
dataType: "jsonp",
type: "GET",
timeout: 10000,
jsonpCallback: "MyCallback",
success: function (data, textStatus, jqXHR) {
alert(data);
},
error: function (jqXHR, textStatus, errorThrown) {alert('error');
},
complete: function (jqXHR, textStatus) {alert('complete');
}
});
}
function MyCallback(data) {
alert(data);
}
$.ajax メソッド呼び出しの jsonpCallback プロパティを確認してください。
Web サービス呼び出しへの生の要求は次のようになります。
GET http://localhost/Service/JSONPService.svc/GetDate?callback=MyCallback&_=1343391683779 HTTP/1.1
Host: localhost
Connection: keep-alive
また、WCF REST サービスからの生の応答は次のようになります。
HTTP/1.1 200 OK
Cache-Control: private
Content-Type: application/x-javascript
Date: Fri, 27 Jul 2012 12:21:23 GMT
Content-Length: 27
MyCallback("27\/07\/2012");
注: JSONP リクエストを実行すると、$.ajax メソッドの error/complete/success は呼び出されません。