Electron uygulamamda konsola nasıl veri veya mesaj kaydedebilirim?

Bu gerçekten basit bir merhaba dünya, geliştirici araçlarını varsayılan olarak açıyor, çünkü kullanamıyorum console.log('hi'). Electron için bir alternatif var mı?

main.js

var app = require('app');
var BrowserWindow = require('browser-window');

require('crash-reporter').start();

var mainWindow = null;

app.on('window-all-closed', function() {
  // Mac OS X - close is done explicitly with Cmd + Q, not just closing windows
  if (process.platform != 'darwin') {
    app.quit();
  }
});

app.on('ready', function(){
  mainWindow = new BrowserWindow({ width: 800, height: 600});

  mainWindow.loadUrl('file://' + __dirname + '/index.html');

  mainWindow.openDevTools();

  mainWindow.on('closed', function(){
    mainWindow = null;
  });
});

console.log çalışır, ancak günlüğün nereye kaydedileceği, onu ana işlemden mi yoksa oluşturucu işleminden mi çağırdığınıza bağlıdır.

Oluşturucu işleminden çağırırsanız (yani, index.htmldosyanızdaki JavaScript ), dev tools penceresine kaydedilir.

Ana süreçten çağırırsanız (yani main.js, Node'da olduğu gibi çalışacaktır - terminal penceresine oturum açacaktır). Electron sürecinizi Terminal'den kullanarak electron .başlatıyorsanız, console.logaramalarınızı oradaki ana işlemden görebilirsiniz .

Ayrıca pencerelere bir ortam değişkeni de ekleyebilirsiniz:

ELECTRON_ENABLE_LOGGING=1

Bu konsol mesajlarını terminalinize gönderecektir.

İşleyici işleminin içinden konsola giriş yapmanın başka bir yolu vardır. Bu Electron olduğu için, Node'un yerel modüllerine erişebilirsiniz. Bu, consolemodülü içerir .

var nodeConsole = require('console');
var myConsole = new nodeConsole.Console(process.stdout, process.stderr);
myConsole.log('Hello World!');

Bu kod oluşturucu işleminin içinden çalıştırıldığında, Hello World! Electron'u çalıştırdığınız terminale gireceksiniz.

Modül hakkında daha fazla belge için https://nodejs.org/api/console.html bakın console.

Yine başka bir olasılık, ana işlem konsoluna aşağıdakileri kullanarak erişmektir remote.getGlobal(name):

const con = require('electron').remote.getGlobal('console')
con.log('This will be output to the main process console.')

M.Dianyan'ın cevabına ek olarak, ana işlemin konsoluna herhangi bir işleyiciden erişebilmem için bunu nasıl ayarladığımı burada bulabilirsiniz.

Ana uygulamanızda şunları ekleyin:

const electron = require('electron');
const app = electron.app;
const console = require('console');
...
app.console = new console.Console(process.stdout, process.stderr);

Herhangi bir oluşturucuda şunları ekleyebilirsiniz:

const remote = require('electron').remote;
const app = remote.app;
...
app.console.log('This will output to the main process console.');

process.stdout.write('your output to command prompt console or node js ')

Npm paket elektron günlüğünü kullanabilirsiniz https://www.npmjs.com/package/electron-log

Hatalarınızı, uyarılarınızı, bilgilerinizi, ayrıntılı, hata ayıklama, saçma çıktılarınızı yerel işletim sistemi günlüğünüze kaydeder.

var log = require('electron-log');

log.info('Hello, log');
log.error('Damn it, an error');

Bu, bazı ek bilgiler için cscsandy5'in yanıtının devamıdır, buradan bilgi

process.stdout.write('your output to command prompt console or node js ')

Bu kod, elektron uygulamasını başlattığınız terminal penceresine basit bir hata ayıklama mesajı göndermek için harika çalışıyor ve console.log'un üzerine inşa edildiği şey budur.

Düğmeye her basıldığında terminale merhaba yazacak bir jQuery betiğinin örnek bir parçacığı (tutorialspoint electon öğreticisine dayalı olarak) aşağıda verilmiştir (uyarı: çıktı dizelerine kendi satır sonlarınızı eklemeniz gerekir!)

let $ = require('jquery')
var clicks = 0;

$(function() {
    $('#countbtn').click(function() {
        //output hello <<<<<<<<<<<<<<<<<<<<<<<
        process.stdout.write('hello')

        $('#click-counter').text(++clicks);
    });

    $('#click-counter').text(clicks);
});

Alex Warren'ın yazdığı her şey doğrudur. Burada önemli olan Electron'un nasıl başladığıdır. Package.json dosyasında standart komut dosyasını kullanırsanız çalışmayacaktır. Yapmakconsole.log() çalışmalarına bu yenisi ile eski senaryoyu değiştirin.

Eski olan:

"scripts": {
    "start": "electron ."
}

Yeni olan:

"scripts": {
    "start": ".\\node_modules\\electron\\dist\\electron.exe ."
}

Artık tüm console.log()aramalar da terminalde gösteriliyor.

Kullandığım şey bu:

let mainWindow // main window reference, you should assign it below 'mainWindow = new BrowserWindow'

function log(...data) {
  mainWindow.webContents.executeJavaScript("console.log('%cFROM MAIN', 'color: #800', '" + data + "');");
}

Örnek kullanım (ile aynı console.log):

log('Error', { msg: 'a common log message' })
log('hello')

Kaynak: logger.js dosyasında https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main , burada gerçek bir kullanım örneği görebilirsiniz.

Biraz araştırmadan sonra, işte benim anlayışım:

kod

(1) main.js

const createPyProc = () => {
  console.log('In createPyProc')
...
  console.log('scriptStart=%s', scriptStart)
...
  console.log('scriptOther=%s', scriptOther)
...
}

...

let mainWindow = null

const createWindow = () => {
  mainWindow = new BrowserWindow(
    {
      width: 1024,
      height: 768,
      webPreferences: {
        nodeIntegration: true,
      }
    }
  )
  mainWindow.loadURL(require('url').format({
    pathname: path.join(__dirname, 'index.html'),
    protocol: 'file:',
    slashes: true
  }))
  mainWindow.webContents.openDevTools()

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}
...

Not: hangisi openDevToolsaçılırElectron Dev Tools

(2) render.js

const zerorpc = require("zerorpc")
...
    console.log("clientStart %d server is ready", PORT_START)
...
})

(3) render.js:index.html

<!DOCTYPE html>
<html>
...
  <script>
    require('./renderer.js')
  </script>
</html>

console.log

Çıktı Mantığı

• iki işlem ve console.log çıktısı:
  • main process= NodeJS process= buradaElectron UI process
    • -> console.login main.js, günlüğü buraya çıkarır
  • render process
    • -> console.login render.js, günlüğü buraya çıkarır

Ekran Görüntüsü Örneği

• DEBUG = Geliştirme modu
  • Çalıştırmak ./node_modules/.bin/electron .
    • 
• Üretim = Yayın modu = hazırlayan xxx.appeletron-builder
  • Çalıştırmak /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • 
  • eklendi export ELECTRON_ENABLE_LOGGING=true, render.jsconsole.log AYRICAmain process terminale çıktı
    • 

Eski bir iş parçacığı açtığım için üzgünüz, ancak bu "console.log'un terminale nasıl çıkarılacağı" (veya benzer aramalar) için en iyi sonuçtur.

Terminale neyin gönderileceği üzerinde biraz daha fazla kontrol sahibi olmak isteyenler için webContents.on ('console-message') uygulamasını şu şekilde kullanabilirsiniz:

mainWindow.webContents.on('console-message', (event, level, message, line, sourceId) => {
      console.log(message + " " +sourceId+" ("+line+")");
});

Görmek:

webContents Belgeler

BrowserWindow belgelerinde webContents girişi

console.log()hata ayıklama için iyi çalışacak. Gibi electrontarayıcının üzerine inşa edilmiştir, bu etmiştir DevToolssen hata ayıklama amacıyla DevTools'un kullanabilirsiniz destekler. Ancak console.log()yöntemin histerik bir davranışı vardır . Aradığınızda console.log()gelen main processelektron uygulamasının, bu olacak sadece uygulamayı başlattı ve nerede terminal penceresine çıktı sen onu çağırdığınızda renderer processo olacak DevTools konsola çıktı.

Bununla, günlükleri görmek için ana Tarayıcı penceresinin geliştirici araçlarını kullanabilirsiniz.

    function logEverywhere(s) {
        if (_debug === true) {
            console.log(s);
            // mainWindow is main browser window of your app
            if (mainWindow && mainWindow.webContents) {
                mainWindow.webContents.executeJavaScript(`console.log("${s}")`);
            }
        }
    }

Örnek , ana tarayıcı penceresinin geliştirici araçlarının konsol panelinde logEverywhere('test') çıktı verecektir// test

Birden fazla argümanı kabul etmek için bu yöntemi geliştirmeniz gerekebilir (bunu yayma operatörü ile es6 ile yapabilirsiniz)

Peki, bu 2019 ve yukarıdaki tüm cevaplarda kimsenin bu numaradan bahsetmediğine inanamıyorum. Tamam, doğrudan tarayıcı konsolunda doğrudan ana bilgisayardan oturum açmaya ne dersiniz? Cevabımı burada verdim: https://stackoverflow.com/a/58913251/8764808 Bir göz atın.