浜松のWEBシステム開発・スマートフォンアプリ開発・RTK-GNSS関連の開発はお任せください
株式会社シーポイントラボ
TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:静岡県浜松市中区富塚町1933-1 佐鳴湖パークタウンサウス2F

【Electron】Base64形式の画像データを別のウィンドウで開く

タイトル通り、Electron のプロジェクトで Base64 形式の画像を別のウィンドウで開く方法についてです。
開発途中で Base64 に変更したので、今までのコードでは画像が表示されなくなってしまったので、その修正です。

実装にあたり、参考にさせていただいたページはこちら。

Electron: loadURL from buffer – Stack Overflow
https://stackoverflow.com/questions/50346287/electron-loadurl-from-buffer

 

サンプルコードは下記のとおりです。

import { remote } from 'electron';

const viewer = new remote.BrowserWindow({
  parent: remote.BrowserWindow.getFocusedWindow(),
  modal: true,
  width: 640,
  height: 480,
  center: true,
  autoHideMenuBar: false,
  webPreferences: {
    plugins: true,
    webSecurity: false,
  },
});
viewer.loadURL(['Base64 形式の画像データ']);

以前のコードからの変更点は 10~13行目の webPreferences の追加と、最終行を viewer.loadURL() に変更したことです。
なお、最終行を viewer.loadURL() に変更するだけでは、確かエラーが発生して動作しなかったはずなので、10~13行目の webPreferences の項目は必ず追加するようにしてください。
サンプルコードは以上です。

 

以上、Electron プロジェクトで Base64 の画像データを別ウィンドウで表示する方法についてでした。
ご参考になれば幸いです。

  • この記事いいね! (0)