Electron(Atom Shell)を使用する際のClient/Serverモデルとは何ですか?
質問
私は、どのようにして エレクトロン (旧 Atom Shell) がどのように動作するのかを理解しようとしています。
私は伝統的な MVC スタイルのウェブアプリケーションから来ました。 コントローラー アクション を通して ルーティングシステム を経由し、コントローラはストア(ファイルシステム、データベース、...)からデータを取得して ビュー をレンダリングし、ブラウザに送り返します。一部のActionは、ブラウザが実際にナビゲートするのではなく、JavaScript/AJAXを介して呼び出されるため、代わりにJSONを送り返すことがあります。
私はそれを、クロスプラットフォームのデスクトップアプリケーションとして作成したいのです。Atom Shell が Chromium ブラウザーと Node.js/v8 ランタイムの両方を結合することは知っていますが、それらがどのように通信するかはわかりません。
私は、完全な Web サーバー (基本的には、以下のような Node.js HTTP ミドルウェア) を実行することができると思います。 エクスプレス しかし、ネットワークに到達可能なサーバーが作成されます (ファイアウォールに引っかかる可能性もあります)。私がデスクトップ アプリを作りたい理由の 1 つは、まさに本物のサーバーを実行しないようにするためです。基本的には、通常のデスクトップ アプリにおける MVP/MVVM パターンのようなものです。
私がやろうとしていることについて、誰かがいくつかの出発点を与えてくれるでしょうか。ブラウザはどのようにノード ランタイム (クライアントと呼ばれるもの) と通信して、ID 12345 のレコードをフェッチしてくださいと伝えるのでしょうか。また、クライアントはレンダリングした HTML を返すのでしょうか、それともブラウザは単に JSON のブロブを取得して JavaScript テンプレート エンジンを通してそれをレンダリングするのでしょうか。
どのように解決するのですか?
ElectronはNode.jsをウェブサーバーとしてではなく、単にバックグラウンドのJavaScriptコードを実行するための環境として使用しているようです。同時に Chromium はアプリのユーザーインターフェイスを提供し、サンドボックス化された通常の JavaScript を実行する通常の Web ページを表示します。前者は直接(Node.jsはスタティックライブラリとしてビルド可能)、後者は libchromiumcontent . ある意味、Node.jsはアプリケーションのコントローラ部分であり、Chromiumはビュー部分と言えます。
一般的に、ここでウェブページに使われるコンセプトは シングルページアプリケーション Web ページは 1 つのアプリケーションウィンドウを表し、このウィンドウが表示されている限り (多くの場合、アプリケーションのライフタイム全体) 存在し続けます。何か別のものを表示する必要があるときはいつでも、AJAXアプリケーションがサーバーにデータを要求するのと同じように、Node.jsで実行されているバックグラウンドコードにデータを要求します。ページ自体は再読み込みされませんが、通常はJavaScriptのテンプレートがコンテンツを更新するために使用されます。
しかし、ここではサーバーとクライアントの関係はなく、通信は実際には双方向に行われます。双方とも
ipc
モジュールを使ってお互いにメッセージを送ることができます (
メインプロセス
,
レンダラ
). これらのメッセージには任意の引数を付けることができ、これらは明示的にエンコードする必要はありません(通常、これは内部でJSONを使ってパラメータをエンコードすることで実装されますが、Electronでそうなっているかどうかは検証していません)。内部的には、このメッセージパッシングはプラットフォーム固有の
IPC
機構を利用して実装されます。
libuv
を使っています。
関連
-
[解決済み] varキーワードの目的と、どのような場合に使用する(または省略する)べきですか?
-
[解決済み] クライアントにJavaScriptファイルを強制的に更新させるには?
-
[解決済み] JSONウェブトークンの無効化
-
[解決済み] クライアントサイドとサーバーサイドのプログラミングの違いは何ですか?
-
[解決済み] chromedriverでSeleniumを使用していることをWebサイトで検出することは可能ですか?
-
[解決済み】Node.jsとブラウザ間でコードを共有するにはどうすればいいですか?
-
[解決済み] NW.js、Brackets-Shell、Electronの機能的な違いは何ですか?
-
[解決済み] アサインの左側にJavascriptのオブジェクトブラケット表記({ ナビゲーション } =)があります。
-
[解決済み] querySelectorAllがない場合、ライブラリを使用せずに属性で要素を取得する?
-
[解決済み] JavaScriptデータフォーマット/プリティプリンタ
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] AngularJSのエラーです。Cross Origin リクエストはプロトコルスキーム http, data, chrome-extension, https に対してのみサポートされています。
-
[解決済み] Node.jsでbase64エンコードされた画像をAmazon S3へアップロードする
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] 兄弟ノードを選択する方法はありますか?
-
[解決済み] JavaScriptを使用してHTML要素に属性を追加/更新するには?
-
[解決済み] javascript includes() 大文字小文字を区別しない
-
[解決済み] BlobからArrayBufferへ移行する方法
-
[解決済み] JSHintの'+'前の改行不良の説明
-
[解決済み] Prototypeを使ってtextareaを自動サイズ調整するには?
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする