Asp.Net を使用して Visual Studio で作成した WebService から通常の html ページ (javascript を使用) にデータを取得させる方法を理解しようとしています。最終的なプロジェクトでは、WebService を 1 つのドメインでホストし、結果を別のドメインの HTML ページで受け取る必要があります。
私のページが Web サービスと通信できるように Web サービスをセットアップする方法を理解するのに非常に苦労しています。
私は従おうとしてきました:
http://www.html5rocks.com/en/tutorials/cors/#toc-adding-cors-support-to-the-server
ここのビデオ: http://www.asp.net/web-forms/videos/how-do-i/how-do-i-create-and-call-a-simple-web-service-in-aspnet
しかし、私はねじれを解決できないようです。Firefox を使用してページを読み込もうとすると、何も返されません。問題が使用しようとしている URL に関係していることはほぼ間違いありませんが、それがどうあるべきかを理解するのに十分な知識はありません。
JavaScriptを使用して関数HelloWorld2から戻り値を取得する最良の方法は何ですか?
前もって感謝します。
ウェブサービス
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
namespace StoneSoupMockup
{
/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://SomeDumbUniqueID.org/", Description="This is a sample service for Stone Soup.", Name="MyService")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[System.Web.Script.Services.ScriptService]
public class Service1 : System.Web.Services.WebService
{
[WebMethod]
public string HelloWorld()
{
return "Hello World";
}
[WebMethod]
public string HelloWorld2(string something)
{
return "Hello " + something;
}
}
}
このように、Web サービス プロジェクトの web.config の httpProtocol にアクセス制御ヘッダーを追加しました。
<system.webServer>
<modules runAllManagedModulesForAllRequests="true"/>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*"/>
<add name="Access-Control-Allow-Headers" value="Content-Type" />
</customHeaders>
</httpProtocol>
</system.webServer>
JavaScript:
//WebServices.js
function myAjax() {
var xmlHttp = new XMLHttpRequest();
//I'm really not sure about this URL. This is what Visual Studio has for the
//URL when I test my app
var url="http://localhost:62033/Service1.asmx/HelloWorld2";
//var parameters = "first=barack&last=obama";
var parameters = "something=timmy"
xmlHttp.open("POST", url, true);
//Black magic paragraph
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.setRequestHeader("Content-length", parameters.length);
xmlHttp.setRequestHeader("Connection", "close");
xmlHttp.onreadystatechange = function() {
if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
document.getElementById('ajaxDump').innerHTML+=xmlHttp.responseText+"<br />";
}
}
xmlHttp.send(parameters);
}
HTML コード:
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<script src="WebServices.js" type='text/javascript'></script>
</head>
<body>
<div id="resultdiv"></div>
<script type='text/javascript'>
myAjax();
</script>
</body>
</html>