[Visual Studio] ModernアプリでNodeサーバとの連携

Modernアプリでも、Nodeサーバと連携してみます。

デスクトップアプリのコードをコピペすれば完了と思ってましたが、そうはいきませんでした。

WebRequest.GetResponse()は使えなくて、非同期型のWebRequest.GetResponseAsync()を使う必要があります。また、WebRequest.GetResponseAsync()は、非同期指定の関数内で使用する必要があるみたいです。ということで、非同期指定関数async void getHelloAsync()を追加して、その中でデータ取得するようにしました。

MainPage.xaml.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using System.Net; //Http系クラス使用のため
using System.IO;

// 空白ページのアイテム テンプレートについては、http://go.microsoft.com/fwlink/?LinkId=234238 を参照してください

namespace HelloWorldModernApp
{
    /// <summary>
    /// それ自体で使用できる空白ページまたはフレーム内に移動できる空白ページ。
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            getHelloAsync();
        }

        private async void getHelloAsync()
        {
            try
            {
                string url = "http://localhost/";

                WebRequest request = (WebRequest)WebRequest.Create(url);
                WebResponse response = (WebResponse)await request.GetResponseAsync();

                Stream stream = response.GetResponseStream();
                StreamReader reader = new StreamReader(stream, System.Text.Encoding.UTF8);
                string result = reader.ReadToEnd();

                formText.Text = result;
            }
            catch (Exception ex)
            {
                formText.Text = ex.Message;
            }
        }
    }
}

modernアプリでは、asyncをつけた関数を作れば、その関数は非同期で動作することが可能になります。
関数getHelloAsyncを非同期で呼び出し、その中でhttpによるデータ取得を行っています。
request.GetResponseAsyncを「await」付で呼び出せば、サーバからの返信を受け取り終わるまでそこでストップしてくれます。asyncを付けた非同期呼び出し関数内なので、ここが停止していてもメインスレッドは止まらないです。

MySQLサーバとNodeサーバを起動して、エミュレータでプログラム実行。

無事接続できました。表示領域が狭くてはみ出してしまっていますが、まあいいでしょう。

実機動作です。特に何もしなくても、分割ウィンドウ動作しますね。スナップ動作はしませんでした。このあたり、画面サイズごとにレイアウト決めたりするのでしょうね。

Modernアプリだと、Windows.Data.JsonでJsonObjectが扱えるようなので、パースしてみます。

root取得→”result”で配列取得→各配列ごとに”name”と”voice”取得→整形して出力、です。

MainPage.xaml.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using System.Net; //Http系クラス使用のため
using Windows.Data.Json; //Json使用のため

// 空白ページのアイテム テンプレートについては、http://go.microsoft.com/fwlink/?LinkId=234238 を参照してください

namespace HelloWorldModernApp
{
    /// <summary>
    /// それ自体で使用できる空白ページまたはフレーム内に移動できる空白ページ。
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            getHelloAsync();
        }

        private async void getHelloAsync()
        {
            try
            {
                string url = "http://localhost/";

                HttpWebRequest request = (HttpWebRequest)WebRequest.Create(url);
                HttpWebResponse response = (HttpWebResponse)await request.GetResponseAsync();

                Stream stream = response.GetResponseStream();
                StreamReader reader = new StreamReader(stream, System.Text.Encoding.UTF8);
                string result = reader.ReadToEnd();

                JsonValue root;
                JsonObject jsonObject;
                string resultString = "";
                if (JsonValue.TryParse(result, out root))
                {
                    jsonObject = root.GetObject();

                    if (jsonObject.ContainsKey("result"))
                    {
                        JsonArray resultArray;
                        resultArray = jsonObject.GetNamedArray("result", null);
                        foreach(JsonValue jsonValue in resultArray)
                        {
                            JsonObject resultJsonObject = jsonValue.GetObject();
                            string nameString = resultJsonObject.GetNamedString("name");
                            string voiceString = resultJsonObject.GetNamedString("voice");
                            resultString += nameString +"「" + voiceString + "」\n";
                        }
                    }
                }
                formText.Text = resultString;
            }
            catch (Exception ex)
            {
                formText.Text = ex.Message;
            }
        }
    }
}

実行します。

できたー。