Electronの開発過程で出会ったいくつかの穴

5002 ワード

javascript electron

会社が開発したダウンロード機の過程で、出会ったいくつかのピット

1.electronにおけるポップアップ窓の確認取り消しとシステムに付属するフォーク番号の関係

シーン:ユーザーがappを終了する時、ユーザーに終了を確認するかどうかを提示する必要があります.この時、弾窓が現れ、確認をクリックして終了を継続し、コールバックを実行します.そうしないと、終了しません.
質問:フォーク番号をクリックした場合、コールバックで返される値は0ですが、コードに書かれているbuttonsの順序が['確認','キャンセル']であるため、「確認」をクリックした場合に対応するresponseも0であり、「確認」をクリックする行為とフォーク番号をクリックする行為が一致することになります.これは正しくありません.フォーク番号をクリックすることはキャンセル終了に等しいはずです.

//     ，         ，           
dialog.showMessageBox(mainWindow, { buttons: ['  ', '  '] }, (response) => {      if (reponse === 0) {
    //       
  } 
});
//      ，      ，          
dialog.showMessageBox(mainWindow, { buttons: ['  ', '  '] }, (response) => {
  if (response === 1) { 
    //         
  } 
});

2.パッケージング後のサブプロセスのコードが実行されていない問題

シーン:ローカル開発中、サブプロセスを使用してリソースをダウンロードし、正常にダウンロードできますが、パッケージ化後、ダウンロードできないことに気づき、サブプロセスのイベントが実行されませんでした.ダウンロードプロセスの障害
問題:electronでサブプロセスを使用する場合は、サブプロセスを外部依存として使用します.パッケージ化後、サブプロセスのコードをパッケージに打ち込むことはありません.追加の構成が必要です.解決策:サブプロセスファイルの追加構成
注意:このプロジェクトの足場はelectron-vueに基づいており、プロファイルはelectron-vueと同じです.

パッケージング構成:asarUnpackこの構成は、サブプロセスで使用されるサードパーティ製のパケットを整理するために使用されます.そうしないと、サブプロセスがこれらのパケットを見つけられず、走ることができません.サブプロセスで使用するサードパーティ製パッケージは、asarUnpackで構成する必要があります.extraResourcesという構成は、私たちのコードサブプロセスファイルが存在するディレクトリを、指定された場所にパッケージ化するために使用されます.コードにサブプロセスファイルを参照する必要がある場所があれば、このアドレスで対応するjsファイルを探します.開発とパッケージ後のパスが異なるため、具体的なpackageです.json構成は以下の

    "mac": {
      "icon": "build/icons/icon.icns",
      "extendInfo": {
        "CFBundleURLSchemes": [
          "link"
        ]
      },
      "asarUnpack": [
        "**/node_modules/electron-log/**/*",
        "**/node_modules/unzipper/**/*",
        "**/node_modules/axios/**/*",
        "**/node_modules/archiver/**/*"
      ],
      "extraResources": [
        {
          "from": "src/main",
          "to": "app.asar.unpacked/download"
        }
      ]
    },
    "win": {
      "icon": "build/icons/icon.ico",
      "asarUnpack": [
        "**/node_modules/electron-log/**/*",
        "**/node_modules/unzipper/**/*",
        "**/node_modules/axios/**/*",
        "**/node_modules/archiver/**/*"
      ],
      "extraResources": [
        {
          "from": "src/main",
          "to": "app.asar.unpacked/download"
        }
      ],
      "target": [
        {
          "target": "nsis",
          "arch": [
            "x64"
          ]
        }
      ]
    }

である.

サブプロセスforkパス:electronでは開発とパッケージング後のサブプロセスのforkパスが異なり、開発時には現在のパスを直接使用して参照することができますが、パッケージング後のサブプロセスjsファイルは直接相対パスで取得できません.したがってforkサブプロセスの場合、パスは、electronで定義されたリソースディレクトリのパス、パッケージング後のサブプロセスjsが存在するパスの構成が必要です.

let isDev = process.env.NODE_ENV !== 'production';
let scriptPath = isDev ? path.join(__dirname, 'child_download_serial.js') : path.join(process.resourcesPath, 'app.asar.unpacked/download/child_download_serial.js');

上記の2つのステップが完了し、パッケージ化が完了すると、インストール後のインストールパッケージの下に自分のサブプロセスのコードディレクトリが表示されます.この場合、構成が成功し、サブプロセスとメインプロセスが正常に通信できることを示します.
以上のシナリオはwindowsの下でmacの下ですべて適用します

3.サブプロセスのロゴが出力されない

シーン:一気にプロセスから出力されるlogを見て、サブプロセスの実行状況を表示したい
質問:サブプロセスのconsoleはコンソールでは表示されません.サブプロセスと親プロセスは別々なので、親プロセスの出力しか表示されません.
解決方法:サブプロセスを取得した後、親プロセスでサブプロセスのstdoutを傍受する.on('data')イベントは、サブプロセス内のすべてのconsole.logは、親プロセスでdataイベントをトリガーし、親プロセスはサブプロセスのconsoleコンテンツを出力します.注意forkの場合はsilent:trueの構成が必要です.trueの場合、サブプロセスのstdin、stdout、stderrは親プロセスに送られます.そうしないと、親プロセスから継承されます.同様に、サブプロセスのstderrのdataイベントをリスニングしたり、サブプロセスのエラーをキャプチャしたりすることもできます.

childDownload = fork(scriptPath, [], { silent: true });
childDownload.stdout.on('data', data => {
  console.log('    console', data.toString());
});

4.electronフラッシュバックの問題

シーン:ソフトウェアを終了すると、コードの理由でエラーが発生し、ソフトウェアが正常に閉じられましたが、再び手動でソフトウェアを開くとフラッシュバックが発生します.
問題:メインプロセスでエラーが発生した後、エラーをキャプチャしなかったため、再度ソフトウェアを開くことは依然としてこのエラーが存在し、ソフトウェアが開かない
解決方法:グローバルにエラーキャプチャを行い、場合によってはエラーがキャプチャされず、ソフトウェアがフラッシュバックできないという問題を回避します.

//          
process.on('uncaughtException', error => {
  log.error(error.stack || JSON.stringify(error));
  app.exit();
});

5.Webエンドの起動クライアントのオーバーライドの問題

シーン:間違った問題の本のダウンロード器はインストールした後に、更に間違った問題の本のloggerツールをインストールして、この時更にwebの中でクリックしてダウンロードツールを呼び覚まして、呼び覚ましたのは間違った問題の本のloggerツールです
質問:さらに両者をパッケージ化すると、対応するappIdが同じになり、後にインストールしたソフトウェアが前にインストールしたソフトウェアを置き換え、再ページで起動すると、置き換えたソフトウェアが起動します
解決方法:package.jsonにおけるappIdは一意性を保証する

6.electronでサブプロセスを使用すると、サードパーティ製パッケージが見つからないという問題

Electronでサブプロセスを使用すると、サードパーティ製パッケージの問題テキストリンクが見つかりません.https://github.com/chaijinson...継続的な更新

HTTPS

ビルド完了時に音を鳴らす(say, saykana, afplay)