ブログ

参考をもとに，ほとんど構造を変えないように注意しながらサーバ側とクライアント側を作成させてもらった。

サーバ側　こっちは作りやすい。

var net = require('net');
var port = 3000;
var server = net.createServer(function (connection) {
  console.log('server: created');
  connection.on('data', function(data){
    connection.write('server: Repeating: ' + data);
  });
  connection.on('close', function(){
    console.log('server: client closed connection');
  });
  connection.on('error', function(){
    console.log('server: client made error');
  });
}).listen(port);
console.log('listening on port 3000');

クライアント側はもしNode.jsなら以下のようになるが，本来socket.connect()にはcallbackを渡すことができる。そこでwrite()を入れていたが，このプログラムはいったん接続が切れたら再接続を図ろうとしている。ところが，connect()に渡したcallbackは次に接続ができるようになった時に１回実行されるので，ずーっと接続ができない状態であるとき接続が始まると，一気に大量のパケットが流れ出す。非常に問題の多いコードになっているので一応コメントアウトしている。

最も目的はPythonなどとの接続であろうからこのクライアント側コードは使わなくてもよい。

var net = require('net');

var port = 3000;
var client = new net.Socket();

client.setEncoding('utf8');

var connect = function () {
  client.connect(port, 'localhost'/*, function() {
    console.log('client: connected to server');
    //client.write('connect');
  }*/);
}

connect();

process.stdin.resume();
process.stdin.on('data', function (data) {
  client.write(data);
});

client.on('data', function (data) {
  console.log('client: ' + data);
});

client.on('close', function () {
  console.log('client: connection is closed');
  setTimeout(connect, 6000);
});

client.on('error', function () {
  console.log('client: made error');
});

もっともこのコードでも，connect()の対応は不完全で接続が確立できないまま何度もconnect()の実行を繰り返すと次第にメモリ使用量が増えていく。

クライアント側でNode.jsで再接続を実装する場合には，node-net-reconnectなどの使用を検討された方がよいかもしれない。

まずCefSharpの方だが，最近CefSharpのバージョンが65に上がったが概ねここに書いた記事のまま使用できる(というかまだパッケージ自体はAny CPU対応を謳っているが，これをインストールしただけでAny CPU対応の記述をプロジェクトファイルに追記していないと使えもしない状態が続いている)。

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            var browser = new CefSharp.Wpf.ChromiumWebBrowser();
            // アドレスの取得
            String page = string.Format(@"{0}\dist\index.html", StartupPath);
            BrowserSettings browserSettings = new BrowserSettings();
            browserSettings.FileAccessFromFileUrls = CefState.Enabled;
            browserSettings.UniversalAccessFromFileUrls = CefState.Enabled;
            browser.BrowserSettings = browserSettings;
            // アドレス設定
            browser.BrowserSettings.AcceptLanguageList = "ja-JP";
            browser.Address = page;
            Content = browser;
        }

        // 実行ファイルのディレクトリ取得
        public string StartupPath
        {
            get
            {
                return System.IO.Path.GetDirectoryName(System.IO.Path.GetFullPath(Environment.GetCommandLineArgs()[0]));
            }
        }
    }

Windows Formsが必要ならここに書いた(差分が必要)。

そして，vue-cliでコンテンツを用意する方法だが，コマンドプロンプトでnpm run devを実行するとdistフォルダにコンテンツが生成されるが，ここにあるようにconfig/index.jsのbuildのオブジェクトのassetsPublicPathを'./'に変更する必要がある。