\

c# でリスニング状態のポートを確認する方法

プログラミング

c# でリッスン状態のTCP/IPポートを確認する方法について説明します。

ipad-820272_640.jpg

IPGlobalProperties クラスと IPEndPointクラスを使用します。

IPGlobalProperties Class

IPEndPoint Class

以下のコードでは、portNo変数に指定したポート番号「8080」が、TCP/IPリスナーで使用されているかチェックします。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//using System.Net.NetworkInformation;
//using System.Net;

    int portNo = 8080;

    IPGlobalProperties ipGlobalProperties = IPGlobalProperties.GetIPGlobalProperties();
    IPEndPoint[] tcpConnInfoArray = ipGlobalProperties.GetActiveTcpListeners();

    foreach (IPEndPoint endpoint in tcpConnInfoArray)
    {
        if (endpoint.Port == portNo)
        {
            //ポート使用中
        }
    }

IPEndPointクラスには、アドレスやポート番号といったプロパティが定義されています。

以下のように書くと、現在使用中のアドレスとポート番号を表示します。

1
2
3
4
5
6
7
8
9
10
//using System.Net.NetworkInformation;
//using System.Net;

    IPGlobalProperties ipGlobalProperties = IPGlobalProperties.GetIPGlobalProperties();
    IPEndPoint[] tcpConnInfoArray = ipGlobalProperties.GetActiveTcpListeners();

    foreach (IPEndPoint endpoint in tcpConnInfoArray)
    {
        Console.WriteLine($"{endpoint.Address}:{endpoint.Port}");
    }

- 実行例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
0.0.0.0:21
0.0.0.0:80
0.0.0.0:135
0.0.0.0:445
0.0.0.0:5040
0.0.0.0:49664
0.0.0.0:49665
0.0.0.0:49666
0.0.0.0:49667
0.0.0.0:49668
0.0.0.0:49669
0.0.0.0:49670
127.0.0.1:2323
127.0.0.1:60183
127.0.0.1:60206
127.0.0.1:60207
192.168.2.111:139
:::21
:::80
:::135
:::445
:::49664
:::49665
:::49666
:::49667
:::49668
:::49669
:::49670

ちなみに、アクティブなUDPリスナーを参照するには、GetActiveUdpListeners()を使用します。

1
2
3
4
5
6
7
8
9
10
//using System.Net.NetworkInformation;
//using System.Net;

    IPGlobalProperties ipGlobalProperties = IPGlobalProperties.GetIPGlobalProperties();
    IPEndPoint[] tcpConnInfoArray = ipGlobalProperties.GetActiveUdpListeners();

    foreach (IPEndPoint endpoint in tcpConnInfoArray)
    {
        Console.WriteLine($"{endpoint.Address}:{endpoint.Port}");
    }

- 実行例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
0.0.0.0:5050
0.0.0.0:5353
0.0.0.0:5353
0.0.0.0:5353
0.0.0.0:5355
127.0.0.1:1900
127.0.0.1:49664
127.0.0.1:63487
127.0.0.1:63488
127.0.0.1:63684
127.0.0.1:63685
127.0.0.1:64536
127.0.0.1:64612
127.0.0.1:64613
127.0.0.1:64850
127.0.0.1:64851
192.168.2.111:137
192.168.2.111:138
192.168.2.111:1900
192.168.2.111:64535
:::5353
:::5353
:::5355
::1:1900
::1:64534
fe80::c567:d05e:b3fa:a62e%4:1900
fe80::c567:d05e:b3fa:a62e%4:64533

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

【議事メモのススメ】議事録ではなく、要点のみ記載した議事メモを書こう

仕事効率化

会議のとき、議事録を書いていますか？

議事録は「誰が」「何を」「いつ」発言したかを事細かに記載したもので、無駄が多かったり要点が分かりにくいなどのデメリットがあります。

一方で、要点だけをまとめた「議事メモ」を書くと、少ない文章量で簡潔に会議結果を表すことができます。

この記事では、議事メモの書き方、メリットについて紹介します。

議事メモとは？

議事メモとは、会議の結果を要点だけ記載したメモです。

具体的には、以下のような内容を書きます。

  • 出席者
  • 会議の開催日時
  • 決定事項
  • 特記事項（決定に至った経緯など）
  • 宿題事項
  • 今後の検討事項

議事メモの特徴は、要点だけを書くということです。

議事録と議事メモの違い

議事メモは、会議の要点だけを書きます。

そのため、少ない文章量で書ききることができます。

一方で、議事録は、誰がどう発言したか、会議の進行内容が分かるように書くのが一般的です。

会議時間や出席者が多くなると、議事録の記載内容は多くなります。

議事録のデメリット

議事録のデメリットは、以下のとおりです。

  • 一人ひとりの発言を文章に残すため、無駄が多い
  • 結論や決定事項に影響しない内容も議事録に残す必要がある。

議事録は無駄が多いです。細かい発言内容を記録する必要がありますが、その内容が必要になることなんてほとんどありません。

会議の種類・重要度にも因りますが、議事録ほどの情報量は必要ない場合がほとんどです。

議事メモのメリット

議事メモのメリットは、以下のとおりです。

  • 少ない文章量で会議の結果を表すことができる
  • 文章量が少ないので、書き手も読み手も時間短縮になる。
  • 宿題事項や決定事項がまとまっているので、読みやすく理解しやすい

議事メモは要点だけを書きます。そのため、書く時間が大幅に短縮できます。また、文章量が少ないので、読む人も簡単に読むことができます。

会議の内容にも因りますが、５分～１０分ほどで書くことができるでしょう。

議事メモを書くときの注意事項

  • 議事メモの内容の漏れ・記載誤りが無いか、出席者に確認する

要点だけを書くという性質上、何を書くべきで何が不要なのか、ここを間違えてしまうと、残すべき情報が残らないということが発生します。

そのため、議事メモを書いたら必ず他の出席者に「内容の漏れ・誤りが無いか出席者に確認」しましょう。

おわりに

一般的な会議では、議事録ほどの情報量が必要なことはあまりありません。

要点だけをまとめた議事メモの方が、今後の作業方針や宿題事項などが分かりやすいです。時間短縮もできます。

無駄な時間を使わないよう、議事メモを積極的に活用してみてはいかがでしょうか。

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

BlazorServerでリッスンポート番号を変更する方法

プログラミング

BlazorServerはデフォルトで http://localhost:5000 と https://localhost:5001 でリッスンしています。

このポート番号を変更する方法について紹介します。

IWebHostBuilder UseUrls を使う

Program.cs では、以下のとおりCreateHostBuilderが記述されています。

1
2
3
4
5
6
public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>();
        });

webBuilder.UseStartupのあとに.UseUrlsを使ってURLを指定します。

localhostのURLを１つだけ定義する

以下のように書くと、10111番ポートでhttpリクエストを受け付けます。

1
2
3
4
5
6
7
public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>()
            .UseUrls("http://localhost:10111");
        });

localhostのURLを２つ以上定義する方法

UseUrlsはString型配列を引数として持つことができますので、以下のように複数のURLを定義することもできます。

このように書くと、http://localhost:10111 と https://localhost:10112 の２つで受け付けることになります。

1
2
3
4
5
6
7
public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>()
            .UseUrls(new string[] {"http://localhost:10111", "https://localhost:10112"});
        });

外部ネットワークに向けてポートを解放する方法

URLをlocalhostではなくIPアドレスで指定すると、外部ネットワークに向けてポートを解放することもできます。

1
2
3
4
5
6
7
public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>()
            .UseUrls(new string[] {"http://192.168.2.112:10111", "https://192.168.2.112:10112"});
        });

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

【超簡単】c#でJSONを読み書きする方法

プログラミング

c#でJSONファイルに変換したり、JSONファイルを読み込む方法について紹介したいと思います。

使用するアセンブリ

この記事では System.Text.Json を使用しています。

そのため、ソースコードの先頭に以下を記述します。

1
using System.Text.Json;

クラスオブジェクトをJSONに変換する

以下のようなクラスがあったとします。

1
2
3
4
5
class Data {
    public int id {get; set;}
    public string name {get; set;}
    public string dept { get; set;}
}

このクラスに値をセットして、JSONに出力するソースコードは以下になります。

1
2
3
4
5
6
7
8
9
10
11
12
static void JsonSer()
{
    Data data = new Data();

    data.id = 1;
    data.name = "john";
    data.dept = "Purchase";

    string jsonStr = JsonSerializer.Serialize(data);
    Console.WriteLine(jsonStr);

}

Dataクラスを dataとしてオブジェクトを作成して、値をセットします。

1
2
3
4
5
Data data = new Data();

data.id = 1;
data.name = "john";
data.dept = "Purchase";

シリアライズ（JSON形式に変換）し、string型変数に格納します。

1
string jsonStr = JsonSerializer.Serialize(data);

以下のように出力されれば、成功です。

1
{"id":1,"name":"john","dept":"Purchase"}

配列のクラスオブジェクトをJSONに変換する

配列オブジェクトも簡単にシリアライズできます。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
static void JsonSerArray()
{
    Data[] data = new Data[3];

    data[0] = new Data();
    data[0].id = 1;
    data[0].name = "john";
    data[0].dept = "Purchase";

    data[1] = new Data();
    data[1].id = 2;
    data[1].name = "Mickey";
    data[1].dept = "Sales";

    data[2] = new Data();
    data[2].id = 3;
    data[2].name = "Donald";
    data[2].dept = "Planning";

    string jsonStr = JsonSerializer.Serialize(data);
    Console.WriteLine(jsonStr);

}

以下のように出力されれば、成功です。

1
[{"id":1,"name":"john","dept":"Purchase"},{"id":2,"name":"Mickey","dept":"Sales"},{"id":3,"name":"Donald","dept":"Planning"}]

JSONを読み込み、クラスオブジェクトに格納する方法

今度は逆にJSONをファイルから読み込み、クラスオブジェクトに格納してみます。

1
2
3
4
5
6
7
8
9
10
11
12
13
static void readJson()
{

    string jsonStr = ReadAllLine("jsonStr.json", "utf-8");

    Data jsonData = new Data();
    jsonData = JsonSerializer.Deserialize<Data>(jsonStr);

    Console.WriteLine($"jsonData.id = {jsonData.id}");
    Console.WriteLine($"jsonData.name = {jsonData.name}");
    Console.WriteLine($"jsonData.dept = {jsonData.dept}");

}

読み込むファイルjsonStr.jsonの中身は、以下のとおりです。

1
{"id":1,"name":"john","dept":"Purchase"}

ReadAllLine関数は、ファイルを全行読み込む処理を行います。

1
2
3
4
5
6
7
8
public static string ReadAllLine(string filePath, string encodingName)
{
    StreamReader sr = new StreamReader(filePath, Encoding.GetEncoding(encodingName));
    string allLine = sr.ReadToEnd();
    sr.Close();

    return allLine;
}

JSONデータを読み込み（デシリアライズ）するには、JsonSerializer.Deserialize<T>を使用します。

1
jsonData = JsonSerializer.Deserialize<Data>(jsonStr);

以下のように標準出力に出力されれば成功です。

1
2
3
jsonData.id = 1
jsonData.name = john
jsonData.dept = Purchase

配列型JSONを読み込み、クラスオブジェクトに格納する方法

今度は配列型のJSONをデシリアライズしてみます。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
static void readJsonArray()
{

    string jsonStr = ReadAllLine("jsonStrArray.json", "utf-8");
    Console.WriteLine(jsonStr);

    Data[] jsonData = new Data[3];
    jsonData = JsonSerializer.Deserialize<Data[]>(jsonStr);

    foreach(Data item in jsonData)
    {
        Console.WriteLine($"jsonData.id = {item.id}");
        Console.WriteLine($"jsonData.name = {item.name}");
        Console.WriteLine($"jsonData.dept = {item.dept}");
    }

}

読み込むファイルjsonStrArray.jsonの中身は以下のとおりです。

1
[{"id":1,"name":"john","dept":"Purchase"},{"id":2,"name":"Mickey","dept":"Sales"},{"id":3,"name":"Donald","dept":"Planning"}]

このデータは配列要素が３つありますので、Dataクラスオブジェクトを要素３の配列として定義します。

1
Data[] jsonData = new Data[3];

デシリアライズする際の型はData[]になります。

1
jsonData = JsonSerializer.Deserialize<Data[]>(jsonStr);

以下のように出力されれば成功です。

1
2
3
4
5
6
7
8
9
jsonData.id = 1
jsonData.name = john
jsonData.dept = Purchase
jsonData.id = 2
jsonData.name = Mickey
jsonData.dept = Sales
jsonData.id = 3
jsonData.name = Donald
jsonData.dept = Planning

ソースコード全文

この記事を書くにあたって使用したソースコードの全文を記載します。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
using System;
using System.Text.Json;
using System.IO;
using System.Text;


namespace csjson
{
    class Program
    {
        static void Main(string[] args)
        {
            Console.WriteLine("Hello World!");
            readJsonArray();
        }

        class Data {
            public int id {get; set;}
            public string name {get; set;}
            public string dept { get; set;}
        }

        static void JsonSer()
        {
            Data data = new Data();

            data.id = 1;
            data.name = "john";
            data.dept = "Purchase";

            string jsonStr = JsonSerializer.Serialize(data);
            Console.WriteLine(jsonStr);
            writeFile("utf-8", "jsonStr.json", jsonStr);

        }

        static void JsonSerArray()
        {
            Data[] data = new Data[3];

            data[0] = new Data();
            data[0].id = 1;
            data[0].name = "john";
            data[0].dept = "Purchase";

            data[1] = new Data();
            data[1].id = 2;
            data[1].name = "Mickey";
            data[1].dept = "Sales";

            data[2] = new Data();
            data[2].id = 3;
            data[2].name = "Donald";
            data[2].dept = "Planning";

            string jsonStr = JsonSerializer.Serialize(data);
            Console.WriteLine(jsonStr);
            writeFile("utf-8", "jsonStrArray.json", jsonStr);

        }

        static void readJson()
        {

            string jsonStr = ReadAllLine("jsonStr.json", "utf-8");
            Console.WriteLine(jsonStr);

            Data jsonData = new Data();
            jsonData = JsonSerializer.Deserialize<Data>(jsonStr);

            Console.WriteLine($"jsonData.id = {jsonData.id}");
            Console.WriteLine($"jsonData.name = {jsonData.name}");
            Console.WriteLine($"jsonData.dept = {jsonData.dept}");

        }



        static void readJsonArray()
        {

            string jsonStr = ReadAllLine("jsonStrArray.json", "utf-8");
            Console.WriteLine(jsonStr);

            Data[] jsonData = new Data[3];
            jsonData = JsonSerializer.Deserialize<Data[]>(jsonStr);

            foreach(Data item in jsonData)
            {
                Console.WriteLine($"jsonData.id = {item.id}");
                Console.WriteLine($"jsonData.name = {item.name}");
                Console.WriteLine($"jsonData.dept = {item.dept}");
            }

        }





        public static void writeFile(string encodingName, string filePath, string writeText)
        {

            Encoding encoding = Encoding.GetEncoding(encodingName);
            StreamWriter writer = new StreamWriter(filePath, false, encoding);
            writer.WriteLine(writeText);

            writer.Close();

        }

        public static string ReadAllLine(string filePath, string encodingName)
        {
            StreamReader sr = new StreamReader(filePath, Encoding.GetEncoding(encodingName));
            string allLine = sr.ReadToEnd();
            sr.Close();

            return allLine;
        }


    }
}

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

JavaScriptからBlazor関数を呼び出す方法

プログラミング

Blazorを使うとSPAを簡単に開発することができます。C#プログラマーにとってはうれしいフレームワークです。

この記事では、JavaScriptからBlazor関数を呼び出す方法について紹介します。

引数なし、返り値なしでBlazor関数を呼び出す

引数なしで関数を呼び出すには、以下のようき書きます。

  • 呼び出し側のJavaScript
1
2
3
4
function CallBlazorFunc()
{
    DotNet.invokeMethodAsync('20200713', 'JSInvokableFunc1')
}
  • JavaScriptから呼び出されるBlazor関数
1
2
3
4
5
[JSInvokable]
public static void JSInvokableFunc1()
{
    Console.WriteLine("JSInvokableFunc1 called");
}

JavaScript側は、DotNet.invokeMethodAsyncを使用します。

第一引数は、呼び出す関数の名前空間を指定します。

第二引数は、呼び出すBlazor関数名を指定します。

ブラウザからJavaScriptを実行すると、以下のようにIISウェブサーバー標準出力に「JSInvokableFunc1 called」が表示されれば成功です。

引数ありでBlazor関数を呼び出す

引数を与えるには、DotNet.invokeMethodAsyncの第三引数以降に記載します。

  • 呼び出し側のJavaScript
1
2
3
4
5
6
function CallBlazorFuncWithParam()
{
    let param1 = 'param1';
    DotNet.invokeMethodAsync('20200713', 'CallBlazorFuncWithParam', param1)

}
  • JavaScriptから呼び出されるBlazor関数
1
2
3
4
5
[JSInvokable]
public static void CallBlazorFuncWithParam(string param1)
{
    Console.WriteLine($"CallBlazorFuncWithParam called : {param1}");
}

引数に「param1」を与えた場合、以下のようにIISウェブサーバー標準出力に「CallBlazorFuncWithParam called : param1」が表示されれば成功です。

Blazor関数を呼び出し、返り値を取得する

Blazor関数の返り値をJavaScript側に返すこともできます。

  • 呼び出し側のJavaScript
1
2
3
4
5
6
7
function CallBlazorFuncRetValue()
{
    DotNet.invokeMethodAsync('20200713', 'CallBlazorFuncRetValue')
    .then(data => {
        console.log(data);
    })
}
  • JavaScriptから呼び出されるBlazor関数
1
2
3
4
5
6
[JSInvokable]
public static string CallBlazorFuncRetValue()
{
    Console.WriteLine("CallBlazorFuncRetValue");
    return "CallBlazorFuncRetValue";
}

thenメソッドでデータを取得して利用します。

実行すると、以下のようにブラウザコンソールに「CallBlazorFuncRetValue」が出力されれば成功です。

ソースコード全文

この記事で紹介したソースコードです。

  • 呼び出し側のJavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function CallBlazorFunc()
{
    DotNet.invokeMethodAsync('20200713', 'JSInvokableFunc1')
}

function CallBlazorFuncWithParam()
{
    let param1 = document.getElementById("param1").value;
    console.log(param1);
    DotNet.invokeMethodAsync('20200713', 'CallBlazorFuncWithParam', param1)

}

function CallBlazorFuncRetValue()
{
    DotNet.invokeMethodAsync('20200713', 'CallBlazorFuncRetValue')
    .then(data => {
        console.log(data);
    })
}
  • razorページ
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
@page "/fromJS"

<h1>From JavaScript Function</h1>

<button onclick="CallBlazorFunc()">CallBlazorFunc</button>

<hr>

<input type="text" placeholder="param1" id="param1"/>
<button onclick="CallBlazorFuncWithParam()">CallBlazorFuncWithParam</button>

<hr>

<button onclick="CallBlazorFuncRetValue()">CallBlazorFuncRetValue</button>



@code {

    [JSInvokable]
    public static void JSInvokableFunc1()
    {
        Console.WriteLine("JSInvokableFunc1 called");
    }

    [JSInvokable]
    public static void CallBlazorFuncWithParam(string param1)
    {
        Console.WriteLine($"CallBlazorFuncWithParam called : {param1}");
    }

    [JSInvokable]
    public static string CallBlazorFuncRetValue()
    {
        Console.WriteLine("CallBlazorFuncRetValue");
        return "CallBlazorFuncRetValue";

    }
}

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

BlazorからJavascriptを呼び出す・実行する方法

プログラミング

Blazor は C# で書けるSPAフレームワークです。c#のコードからJavaScriptの関数を呼び出すことができます。

この記事では、BlazorからJavaScriptを呼び出す方法について紹介します。

JSRuntimeの使用

BlazorからJavaScriptを呼び出すには、JSRuntimeを使用します。
razorページファイルの先頭に以下を追記します。

1
@inject IJSRuntime JSRuntime;

引数なしでJavaScript関数を呼び出す

引数なしでJavaScriptを実行するには、以下のように書きます。

FromBlazorFuncというJavaScript関数を呼び出します。

  • Blazor(C#)
1
2
3
4
private async void callJS()
{
    await JSRuntime.InvokeVoidAsync("FromBlazorFunc");
}

JavaScriptファイル側では、以下のように関数を定義します。

  • JavaScript
1
2
3
4
function FromBlazorFunc()
{
    console.log("Called from Blazor");
}

以下の図のように、ブラウザコンソールに出力されると成功です。

引数ありでJavaScript関数を呼び出す

引数ありでJavaScript関数を呼び出すには、以下のように書きます。

  • Blazor(C#)
1
2
3
4
5
6

private async void CallJSWithParam()
{
    string param1 = "ParamABC";
    await JSRuntime.InvokeVoidAsync("FromBlazroWithParam", param1);
}
  • JavaScript
1
2
3
4
function FromBlazroWithParam(param1)
{
    console.log("Parameter is " + param1);
}

以下の図のように引数つきでブラウザコンソールに出力されれば成功です。

JavaScript関数から返り値を取得する

JavaScriptの返り値をBlazor側に返すこともできます。

  • Blazor (C#)
1
2
3
4
5
private async void CallJSRetValue()
{
    string retValue;
    retValue = await JSRuntime.InvokeAsync<string>("FromBlazorRetValue");
}
1
2
3
4
function FromBlazorRetValue()
{
    return "From JS";
}

以下の図のように、JavaScriptの返り値を取得できれば成功です。

ソースコード全文

この記事で説明したソースコードを以下に記載しておきます。

ボタンとテキストボックスを組み合わせています。

  • Blazor(C#)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

@page "/callJS"
@inject IJSRuntime JSRuntime;

<h1>Call JavaScript Function</h1>


<button @onclick="callJS">Call JS</button>

<hr>

<input @bind-value="param1" placeholder="parameter1" />

<button @onclick="CallJSWithParam">CallJSWithParam</button>

<hr>

<button @onclick="CallJSRetValue">CallJSRetValue</button>
<input @bind-value="retValue" placeholder="Return Value" />


@code {

    private string param1{get; set;}

    private string retValue{get; set;}

    private async void callJS()
    {
        await JSRuntime.InvokeVoidAsync("FromBlazorFunc");
    }

    private async void CallJSWithParam()
    {
        await JSRuntime.InvokeVoidAsync("FromBlazroWithParam", param1);
    }

    private async void CallJSRetValue()
    {
        retValue = await JSRuntime.InvokeAsync<string>("FromBlazorRetValue");
    }

}
  • JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function FromBlazorFunc()
{
    console.log("Called from Blazor");
}


function FromBlazroWithParam(param1)
{
    console.log("Parameter is " + param1);
}

function FromBlazorRetValue()
{
    return "From JS";
}

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

c#でPowerShellスクリプトを実行する方法

プログラミング

c# でPowerShellスクリプトを実行する方法を紹介します。

この記事での実行方法は、System.Management.Automationを使用する方法ではなく、Powershell.exe を呼び出して実行します。

実行するソースコード

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

//using System.Diagnostics;


/// <summary>
/// PowerShellスクリプトを実行する
/// </summary>
/// <param name="ps1FilePath">PowerShellスクリプト(*.ps1)ファイル名</param>
/// <param name="args">引数リスト</param>
/// <param name="stdOut">標準出力</param>
/// <param name="stdErr">標準エラー出力</param>
/// <param name="exitCode">終了コード</param>
public static void ExecPSProcess(string ps1FilePath, List<PowerShellArgs> args, out string stdOut, out string stdErr, out int exitCode)
{
    stdOut = "";
    stdErr = "";
    exitCode = 0;

    try
    {
        string cmdStr = "";
        cmdStr = $"-File {ps1FilePath} ";
        foreach(var item in args)
        {
            cmdStr = cmdStr + $"-{item.argName} {item.argValue}";
        }

        System.Diagnostics.Process process = new System.Diagnostics.Process();
        ProcessStartInfo processStartInfo = new ProcessStartInfo("powershell.exe", cmdStr);

        processStartInfo.CreateNoWindow = true;
        processStartInfo.UseShellExecute = false;

        processStartInfo.RedirectStandardOutput = true;
        processStartInfo.RedirectStandardError = true;

        process = System.Diagnostics.Process.Start(processStartInfo);
        process.WaitForExit();

        stdOut = process.StandardOutput.ReadToEnd();
        stdErr = process.StandardError.ReadToEnd();
        exitCode = process.ExitCode;

        process.Close();

    }
    catch
    {
        throw;
    }
}

以下のコードで、PowerShell.exe の後に続くコマンド文字列を作成します。
-FileスイッチでPowerShellスクリプトファイルパスを指定しています。
スクリプトの引数が格納されているargsをforeachでループして、引数を指定するコマンド文字列を作成します。
PowerShellArgsクラスは後述しています。

1
2
3
4
5
6
string cmdStr = "";
cmdStr = $"-File {ps1FilePath} ";
foreach(var item in args)
{
    cmdStr = cmdStr + $"-{item.argName} {item.argValue}";
}

プロセスオブジェクトを作成して、コマンド文字列を指定します。

1
2
System.Diagnostics.Process process = new System.Diagnostics.Process();
ProcessStartInfo processStartInfo = new ProcessStartInfo("powershell.exe", cmdStr);

ウィンドウの非表示などを指定します。
プロセスを開始し、標準出力、標準エラー出力、終了コードを取得します。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
processStartInfo.CreateNoWindow = true;
processStartInfo.UseShellExecute = false;

processStartInfo.RedirectStandardOutput = true;
processStartInfo.RedirectStandardError = true;

process = System.Diagnostics.Process.Start(processStartInfo);
process.WaitForExit();

stdOut = process.StandardOutput.ReadToEnd();
stdErr = process.StandardError.ReadToEnd();
exitCode = process.ExitCode;

process.Close();

引数を指定するクラスPowerShellArgsクラス

PowerShellスクリプトに渡す引数は以下のクラスを用いて説明します。
上記で説明した関数では、複数指定されることを考慮し、リスト型にして渡しています。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/// <summary>
/// PowerShellスクリプト呼び出し引数クラス
/// </summary>
public class PowerShellArgs
{
    /// <summary>
    /// 引数名称
    /// </summary>
    /// <value></value>
    public string argName {get; set;}

    /// <summary>
    /// 値
    /// </summary>
    /// <value></value>
    public string argValue {get; set;}
}

実行方法

例えば、以下のようなPowerShellスクリプトを実行するとします。
引数OpenFileNameで指定したファイルを、Visual Studio Codeで開くという動作をします。

1
2
3
Param($OpenFileName)

code $OpenFileName

これを実行するためのExecPSProcess関数を呼び出すコードは以下になります。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
string ps1FilePath = @"D:\OpenFileWithCode.ps1";
PowerShellArgs args = new PowerShellArgs();
args.argName = "OpenFileName";
args.argValue = @"D:\docs.md";

List<PowerShellArgs> argsList  = new List<PowerShellArgs>();
argsList.Add(args);

string stdout = "";
string stderr = "";
int exitCode = 0;

ExecPSProcess(ps1FilePath, argsList, out stdout, out stderr, out exitCode);

Console.WriteLine(exitCode);
Console.WriteLine(stdout);
Console.WriteLine(stderr);

実行するPowerShellスクリプトファイルパスを指定し、引数を定義します。
引数はリスト型のPowerShellArgsオブジェクトに格納します。

1
2
3
4
5
6
7
string ps1FilePath = @"D:\OpenFileWithCode.ps1";
PowerShellArgs args = new PowerShellArgs();
args.argName = "OpenFileName";
args.argValue = @"D:\docs.md";

List<PowerShellArgs> argsList  = new List<PowerShellArgs>();
argsList.Add(args);

標準出力、標準エラー出力、終了コードを取得する変数を定義し、ExecPSProcessを呼び出します。

1
2
3
4
5
6
7
8
9
string stdout = "";
string stderr = "";
int exitCode = 0;

ExecPSProcess(ps1FilePath, argsList, out stdout, out stderr, out exitCode);

Console.WriteLine(exitCode);
Console.WriteLine(stdout);
Console.WriteLine(stderr);

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

曖昧な問題点を具体化して解決策を検討する【GOAL, WHAT, WHO, HOWの明確化が必要】

仕事効率化

会社員として働いていると、様々な問題を相談されたり、気付いたりします。

私は社内SEとして働いていますが、「開発効率を上げられないか」「業務担当者でもシステムを作れないか」「ナレッジ管理をしたい」など、です。

これらの問題は非常に曖昧でざっくりしており、何から考えたらいいか分からないことも多くあります。

この記事では、非常に曖昧な問題点を具体化して解決策を検討する方法を紹介します。

この記事のまとめ

  • 問題解決のゴールを明確にする
  • WHAT, WHO, HOW を明確にする

問題解決のゴールを明確にする

まずは、どこまで達成すればいいのか、目標（ゴール）を明確にしましょう。

「開発効率を上げられないか」であれば、「１人月で開発可能なステップ数」などです。具体的に数字で表しましょう。

数字で表すことで、目標に対してどれだけ達成しているのか、「達成率」も数字で表せます。経営陣への説明に効果を発揮します。

WHATを明確にする。

まずは問題点を具体化しないと、どのように解決していけばいいか、道筋が立てられません。

具体化するには、カテゴリ分けして考えてみるという方法があります。

「開発効率を上げる」ということを考えると、

  • **個別システム（ERPやEDIなど）の開発効率
  • 内製・外注などの開発担当の効率
  • プログラム言語やフレームワークの開発効率

などです。

「開発効率を上げる」だけでは、「何の」開発効率を上げるのか、曖昧です。まずはそこを具体化してみます。

「業務担当者でもシステムを作れないか」という問題に対して検討していくのであれば、「何の」システムを業務担当者が作るのか、を明確にしなければいけません。

「ナレッジ管理をしたい」のであれば、「何の」ナレッジを管理したいのか、検討しましょう。

WHOを明確にする。部門や担当者などに特化した解決方法を考えてみる

同じ問題を共有しているすべての人に対して、改善させてあげられたら、それは素晴らしいことです。しかし、それは中々難しい。

そのため、問題を解決させてあげる対象者や対象部門を明確にする必要があります。

「業務担当者でもシステムを作れないか」という問題であれば、「システムを作る人は誰か」を明確にする必要があります。

  • 簡単なプログラム言語の使用経験がある人
  • 開発ツールの使用方法を知っている人
  • ロジックの組立方も分からない、完全な非エンジニア

などです。

「開発ツールの使用方法をしっている人」または「使用方法を学んでもらう人」は、そのツールに特化した解決方法を実行できます。

一方で、「ロジックの組立方も分からない、完全な非エンジニア」であれば、勉強してもらうことからスタートしないといけません。

誰に対して解決方法を提供するのか、これを明確にしないと、アプローチの仕方が全く変わってきます。

HOWを明確にする。何があれば解決するのか、本質を見極める

ここまでくれば、「何を使って、どのように」解決するのかが検討可能になると思います。

具体的な解決方法の施策の検討です。

「業務担当者でもシステムを作れないか」という問題であれば、「UiPathの使い方を知っている人が、UiPathを使ってシステムを作る」などです。

HOWを明確にするということは、解決可能な範囲を明確にするということです。

その解決可能な範囲が、問題提起者にとって満足するかどうかをよく考えておく必要があります。

例えば、「UiPathを使って解決する」ということは、UiPathを使って開発可能なシステムしか解決できません。具体的にいうと、EXCELやOutlookなどを使用したシステム開発はできますが、多人数から情報を求めて集計するなど、サーバー型のシステムは作れません。

このHOWが決まれば、作業アイテムが明確になりますので、見積書を入手してプロジェクト企画書が作成できるようになります。

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

副業を考えているシステムエンジニアの本業の使い方

仕事効率化

現在は、会社で働いていても収入が少ない・安定しないなど、会社勤め・本業に対する不安が多い時代になっています。

副業が重要になってきていますが、本業の実務経験や会社員としての権利を徹底的に副業に活かすべきです。

この記事では、副業を考えているシステムエンジニアの本業の使い方を紹介します。

この記事のまとめ

  • 会社のお金でセミナーを受講しよう
  • 企画書を作って、会社からお金とメンバーを使わせて貰おう
  • 同業他社交流会で他社の課題・問題点を聞いてこよう
  • 最新のツールやフレームワークを導入しよう
  • 有給休暇を使って副業しよう

有料のセミナーを受講する

新しい知識やスキルを身に着けるには、ハンズオンなどのセミナーを受講するのが一番手っ取り早いです。

そしてこのようなセミナーは、内容の濃いものになるほど有料になります。そして有料のセミナーは１回１０万円前後するものもあり、かなり高額です。

正社員であれば必ず教育費用が予算に含まれているはずですので、これを積極的に使いましょう。会社員の権利です。

仕事が忙しくて時間が取れない場合や、外出規制されている場合は、ｅラーニングなどを使いましょう。

どのような副業をするかにもよりますが、副業に役に立つセミナーであれば積極的に活用しましょう。

企画書を作ってプロジェクトを立ち上げる

大きな仕事をするには、お金とチームメンバーが必ず必要になります。しかし、個人や副業では、お金とメンバー集めがなかなか大変です。

お金とメンバーを使ったプロジェクトの進め方を知っていれば、いざ副業で出来ることになったときに、パフォーマンスが違います。

これを会社で経験しましょう。会社の経営にマッチした企画書を作って、経営陣に説明して、お金（予算）とメンバーを確保してもらうのです。

私は社内ＳＥとして働いており、開発期間の短縮化が課題でした。そのため、UiPathというRPAを導入する企画書を作成し、年間４００万円というお金を会社に出してもらいました。

個人で年間４００万円はかなり高額ですが、会社にとっては安いものです。積極的に会社にお金を出させましょう。

同業他社交流会に積極的に参加する

会社員として働いているということは、会社の看板を背負っているということです。しかし、これを重く受け止める必要はなく、利用してやるのがこの記事の目的です。

看板を背負って同業他社交流会に参加しましょう。このような交流会では、他社のノウハウや課題・解決方法・現在も困っていることなど、様々な情報が共有されます。

この情報を副業に活かすのです。困っていることは、お金を払ってでも解決したいものです。１００万円は個人にとっては高額ですが、会社にとっては安価です。困っていることを副業サービスにしてお金を得られるようにすれば、副業収入も安定して楽しくなるはずです。

最新のツールや技術を積極的に導入・検討する

最新のツールや技術は、業界全体の課題を解決していることが多いです。RPAであれば非エンジニアでも簡単に業務効率化できる、Flutterでは、マテリアルデザインを用いてiOSとAndroidのクロスプラットフォームアプリが作れる、という感じです。

リリースしてあまり期間が経過していない場合は安定性や事例に乏しかったりしますので、適用時期は検討が必要ですが、これらの使用経験があるということは会社にとっても自分にとっても利益があります。

有給休暇を使って副業をする

有給休暇こそ会社員の最大の権利です。休んでもお金がもらえるとか最高です。

有給休暇を使って副業してしまいましょう。本業だけでは不安な世の中ですから、副業の収入を手厚くする必要があります。

積極的に有給休暇を使って、副業の基盤を構築しましょう。土日は少し休みたかったり、様々な予定が入ってしまいなかなか捗らないと思いますので、有給休暇を使って平日に副業をやるのです。

副業がうまくいけば、日々の生活がとても楽しくなるはずです。理想の自分になれるように、少しずつがんばりましょう。

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱

システム障害報告書に記載するべき内容

仕事効率化

システム開発をしていると、必ずといっていいほどシステム障害に見舞われることがあります。

システム障害が発生すると、業務や経営に多大な影響を及ぼします。そのため、できるだけ早く原因・対策・報告することが必要になります。

この記事では、システム障害報告書に記載するべき内容について紹介します。

この記事で取り扱うトラブル事例

この記事では、以下のトラブルが発生したという想定で説明したいと思います。

  • ネットワーク機器の故障により、インターネット通信が遮断された
  • これにより、お客様EDIシステムからのデータ受信ができず、計画・発注業務に影響があった
  • 機器のリプレイスを行うことで対策した

事象

事象とは、どのような障害が起こったのか、という内容です。具体的には、以下のような障害事象ですね。

  • 外部向けネットワーク通信が遮断された
  • お客様EDIシステムへからの受注データ受信に失敗した

システム目線で、何が起こったのかを明確に書くことがこのセクションの目的です。何が、どうなったのか、主語と述語を明確にしましょう。

発生日時

障害事象が何時からどれだけの期間発生したのか、書きましょう。

影響

影響とは、発生した事象に対して、業務にどのような損害があったのかを記載します。

例えば、上記の事象からは、以下の影響があったとします。

  • 生産計画の立案ができず、取引先様への注文データ送信が遅延した
  • 取引先様での計画立案が遅延した

特に業務影響は情報システム部門だけでは分からないことが多いです。業務部門へのヒアリングが必要になるでしょう。

直接原因

障害事象が発生した直接的な原因を記載します。この例でいえば、

  • ネットワーク機器の故障

などが該当するかと思います。

根本原因

根本原因は、なぜ「直接原因」に至ったのか、を書きます。
この例では「なぜネットワーク機器が故障したのか」「故障するまでリプレイスされなかったのか」という視点から書きます。

  • 廃番機種であり、新型機種へのリプレイスを検討中であったため、リプレイスされていなかった

など、直接原因を深堀した内容を記載しましょう。

暫定対策

暫定対策とは、発生した障害から回復するために対応した行動のことを書きます。今回は、故障したネットワーク機器をリプレイス
することですので、以下のような内容になります。

  • 障害が発生したネットワーク機器をリプレイスし、通信可能であることを確認した

恒久対策

恒久対策とは、今回のような障害が二度と発生しないような対策を指します。暫定対策で記載したネットワーク機器のリプレイスだけでは、他の機器も同じように故障してしまう可能性があるためです。

  • 廃番機種のリプレイス作業プロセスの見直し

このように、プロセス見直しを恒久対策とすれば、廃番機種が同様の障害に見舞われることはなくなります。

対策スケジュール

暫定対策・恒久対策が完了するまでのスケジュールを書きましょう。

いつになったら完了するのか、現在どこまで作業が進んでいるのか明確にするためです。

ガントチャートが便利で分かりやすいと思います。

ExecNote.app リリースしました！

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません！無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱