इलेक्ट्रॉन ऐप में कंसोल.लॉग () का उपयोग करना


116

मैं अपने इलेक्ट्रॉन ऐप में कंसोल में डेटा या संदेश कैसे लॉग कर सकता हूं?

यह वास्तव में बुनियादी नमस्ते दुनिया डिफ़ॉल्ट रूप से देव उपकरण खोलता है, मैं उपयोग करने में असमर्थ हूं console.log('hi')। क्या इलेक्ट्रॉन के लिए कोई विकल्प है?

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;
  });
});

जवाबों:


158

console.log काम करता है, लेकिन जहां यह लॉग करता है यह इस बात पर निर्भर करता है कि आप इसे मुख्य प्रक्रिया या रेंडरर प्रक्रिया से कहते हैं।

यदि आप इसे रेंडरर प्रक्रिया (यानी जावास्क्रिप्ट जो आपकी index.htmlफ़ाइल से शामिल है ) से कॉल करते हैं, तो इसे देव टूल्स विंडो में लॉग इन किया जाएगा।

यदि आप इसे मुख्य प्रक्रिया (यानी में main.js) से कहते हैं तो यह उसी तरह से काम करेगा जैसे यह नोड में करता है - यह टर्मिनल विंडो में लॉग इन करेगा। यदि आप टर्मिनल से अपनी इलेक्ट्रॉन प्रक्रिया शुरू कर रहे हैं तो आप electron .अपने console.logकॉल को मुख्य प्रक्रिया से देख सकते हैं ।


2
क्या मैं console.log()रेंडरर प्रक्रिया से मुख्य प्रक्रिया कर सकता हूं ?
फंदी सुसंतो

1
@FandiSusanto, आप अपने मुख्य प्रक्रिया को संदेश भेजने के लिए ipcRenderer मॉड्यूल का उपयोग कर सकते हैं और फिर, इसके अंदर कंसोल ()।
arthursfreire

23
उत्पादन प्रक्रिया में क्या अभिप्राय है, मुख्य प्रक्रिया में क्या `कंसोल.लॉग ()` होगा
जिमी ओबोनियो अबोर

16
@JimmyObonyoAbor एक उत्पादन इलेक्ट्रॉन ऐप में एक कंसोल संलग्न करने के लिए और अपने टर्मिनल में कंसोल आउटपुट प्राप्त करने के लिए एक टर्मिनल में निम्नलिखित चलाएँ ./path/to/release/MyProgram.app/Contents/MacOS/MyProgram। यह बाइनरी को चलाएगा MyProgramऔर आपको console.logएक टर्मिनल में प्रक्रिया की घटनाओं को देखने की अनुमति देगा ।
तिथि

ऐप के माध्यम से रीसेट करने के बाद भी मैं टर्मिनल पर सामान कैसे लॉग कर सकता हूं app.relaunch()और app.exit(0)???
ओल्डबॉय

38

आप खिड़कियों में एक पर्यावरण चर भी जोड़ सकते हैं:

ELECTRON_ENABLE_LOGGING=1

यह आपके टर्मिनल पर कंसोल संदेशों को आउटपुट करेगा।


मुझे कंसोल में कोई संदेश दिखाई नहीं दिया जब तक कि यह पर्यावरण चर सेट नहीं किया गया था।
DVK

7
डॉक्स का कहना है कि सेट किया जाना चाहिए trueऔर करने के लिए इसे स्थापित करने कि true, जो क्या ओ पी चाहता है नहीं है "कंसोल के लिए क्रोम के आंतरिक प्रवेश प्रिंट"।
पुशकिन २४'१

@ पुश्किन यह साथ ELECTRON_ENABLE_LOGGING=1ही साथ काम करता है । और जैसा कि ओपी चाहता है, उसके बाद क्या है? प्रभाव देखने के लिए निम्नलिखित सार देख लें ।
x-yuri

किस फ़ाइल को ELECTRON_ENABLE_LOGGING = 1 में जोड़ा गया है?
स्टिल_लर्निंग

1
@Still_learning आप इसे एक पर्यावरण चर के रूप में सेट करें। तो विंडोज कमांड लाइन सेset ELECTRON_ENABLE_LOGGING=true
pushkin

30

रेंडरर प्रक्रिया के अंदर से कंसोल पर लॉग इन करने का एक और तरीका है। यह इलेक्ट्रॉन है इसे देखते हुए, आप नोड के मूल मॉड्यूल तक पहुंच सकते हैं। इसमें consoleमॉड्यूल शामिल है ।

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

जब यह कोड रेंडरर प्रक्रिया के अंदर से चलाया जाता है, तो आपको मिल जाएगा Hello World! उस टर्मिनल में जहां से आपने इलेक्ट्रॉन चलाया था।

मॉड्यूल पर आगे के प्रलेखन के लिए https://nodejs.org/api/console.html देखें console


15

फिर भी एक अन्य संभावना मुख्य प्रक्रिया कंसोल का उपयोग करके पहुंच रही है remote.getGlobal(name):

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

1
यह बहुत अच्छा काम करता है, लेकिन हम पूरे कंसोल आउटपुट को कैसे पकड़ सकते हैं; यानी- बिना किसी विशेष फ़ंक्शन के कॉल करने के लिए; ऐसे अपवाद और त्रुटियां भी आउटपुट हैं?
डेरिक

1
डेरिक: पर्यावरण चर सेट करने का प्रयास करें ELECTRON_ENABLE_LOGGING=1(देखें डीजबी का जवाब)
रैपहाइंड

मैं एक विस्तार के लिए एक पृष्ठभूमि स्क्रिप्ट के अंदर उपयोग करने की कोशिश कर रहा हूं, और यह काम नहीं कर रहा है, क्योंकि यह स्पष्ट नहीं है। (बैकग्राउंड स्क्रिप्ट मूल रूप से बैकग्राउंड विंडो में लोड होती हैं)
Narfanator

7

एम। डेमियन के उत्तर को जोड़ते हुए, यहां बताया गया है कि मैंने इसे कैसे सेट किया ताकि मैं किसी भी रेंडरर से मुख्य प्रक्रिया के कंसोल तक पहुंच पाऊं।

अपने मुख्य ऐप में, जोड़ें:

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

किसी भी रेंडरर में, आप जोड़ सकते हैं:

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

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

4
हालाँकि यह कोड समस्या को हल करने में मदद कर सकता है, यह इस बात की व्याख्या नहीं करता है कि यह सवाल का जवाब क्यों और / या कैसे देता है। इस अतिरिक्त संदर्भ को प्रदान करने से इसके दीर्घकालिक मूल्य में काफी सुधार होगा। कृपया स्पष्टीकरण जोड़ने के लिए अपने जवाब को संपादित करें, जिसमें सीमाएं और मान्यताएं शामिल हैं।
टोबे स्पाइट

5

आप npm पैकेज इलेक्ट्रॉन-लॉग https://www.npmjs.com/package/electron-log का उपयोग कर सकते हैं

यह आपकी त्रुटि, चेतावनी, सूचना, क्रिया, डिबग, आपके मूल ओएस लॉग में मूर्खतापूर्ण आउटपुट लॉग करेगा।

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

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

4

यह कुछ अतिरिक्त जानकारी, यहां से जानकारी के लिए cscsandy5 के उत्तर का अनुसरण है

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

यह कोड उस टर्मिनल विंडो में एक साधारण डिबग संदेश को आउटपुट करने के लिए बहुत अच्छा है, जिससे आपने इलेक्ट्रॉन ऐप लॉन्च किया है और जो कंसोल.लॉग के ऊपर बना है।

यहां एक jQuery स्क्रिप्ट का एक उदाहरण स्निपेट (ट्यूटोरियलस्पॉट इलेक्ट्रान ट्यूटोरियल के आधार पर) है जो हर बार बटन दबाने पर टर्मिनल को हैलो लिखेगा (चेतावनी: आपको आउटपुट स्ट्रिंग्स में अपनी खुद की लाइन ब्रेक जोड़ने की आवश्यकता है!)

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

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

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

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

2

एलेक्स वारेन ने जो कुछ लिखा है वह सच है। यहां महत्वपूर्ण है कि इलेक्ट्रॉन कैसे शुरू किया जाता है। यदि आप package.json फ़ाइल में मानक स्क्रिप्ट का उपयोग करते हैं तो यह काम नहीं करेगा। बनानाconsole.log()काम पुरानी स्क्रिप्ट को इस नए के साथ बदलें।

पुराना वाला:

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

नया:

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

अब सभी console.log()कॉल टर्मिनल में भी प्रदर्शित किए जाते हैं।


2

यही है वह जो मेरे द्वारा उपयोग किया जाता है:

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 + "');");
}

उदाहरण का उपयोग (उसी के रूप में console.log):

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

Source: https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main in logger.js फ़ाइल, यहाँ आप एक वास्तविक उपयोग का मामला देख सकते हैं।


जेएस कोड इंजेक्शन से बचने के लिए डेटा को हालांकि (JSON स्ट्रिंग के रूप में) एन्कोड किया जाना चाहिए।
ज़मी

2

कुछ जांच के बाद, यहाँ मेरी समझ:

कोड

(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
  })
}
...

नोट: जिसे openDevToolsखोला जाना हैElectron Dev Tools

(२) रेंडर .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

आउटपुट तर्क

  • दो प्रक्रिया और इसका कंसोल.लॉग आउटपुट:
    • main process= NodeJS process= यहाँElectron UI process
      • -> console.logइन- main.jsआउटपुट यहां लॉग इन करेगा
    • render process
      • -> console.logइन- render.jsआउटपुट यहां लॉग इन करेगा

स्क्रीनशॉट उदाहरण

  • DEBUG = विकास मोड
    • Daud ./node_modules/.bin/electron .
  • उत्पादन = रिलीज मोड = xxx.app द्वारा pacakgedeletron-builder
    • Daud /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • जोड़ा export ELECTRON_ENABLE_LOGGING=true, render.jsकंसोल.लॉग ALSO आउटपुट टू main processटर्मिनल

1

एक पुराना धागा उठाने के लिए क्षमा करें, लेकिन यह "कंसोल को आउटपुट कैसे करें" टर्मिनल के लिए शीर्ष परिणाम है (या इसी तरह की खोज)।

किसी के लिए जो टर्मिनल के आउटपुट है उस पर थोड़ा और नियंत्रण हासिल करना चाहते हैं, जैसे कि आप WebContents.on ('कंसोल-संदेश') का उपयोग कर सकते हैं:

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

देख:

वेबकंटेंट प्रलेखन

BrowserWindow डॉक्स पर webContents प्रविष्टि


1

console.log()डिबगिंग के लिए ठीक काम करेगा। जैसा कि electronब्राउज़र के शीर्ष पर बनाया गया है, इसका DevToolsसमर्थन है कि आप डिबगिंग उद्देश्य के लिए devtools का उपयोग कर सकते हैं। हालांकि, console.log()विधि का एक हिस्टेरिकल व्यवहार है । जब आप इलेक्ट्रॉन ऐप console.log()से कॉल करते हैं main process, तो यह टर्मिनल विंडो पर आउटपुट करेगा जहां से आपने ऐप लॉन्च किया था और जब आप इसे कॉल renderer processकरेंगे तो यह DevTools कंसोल को आउटपुट करेगा।


1

इसके साथ आप लॉग देखने के लिए मुख्य ब्राउज़र विंडो के डेवलपर टूल का उपयोग कर सकते हैं

    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}")`);
            }
        }
    }

उदाहरण मुख्य ब्राउज़र विंडो के डेवलपर टूल के कंसोल पैनल में logEverywhere('test') आउटपुट होगा// test

आपको कई आर्गन्स को स्वीकार करने के लिए इस पद्धति को बढ़ाने की आवश्यकता हो सकती है (आप इसे es6 तक प्रसार ऑपरेटर के साथ कर सकते हैं)


1

खैर, यह 2019 है और मुझे विश्वास है कि उपरोक्त सभी उत्तरों में किसी ने भी इस ट्रिक का उल्लेख नहीं किया है। ठीक है, तो, कैसे सीधे ब्राउज़र से लॉगिंग के बारे में मुख्य से सीधे सांत्वना? मैं अपने जवाब यहाँ प्रदान की: https://stackoverflow.com/a/58913251/8764808 एक नजर डालें।


धन्यवादaleale! क्या आप अपने उत्तर को रेखांकित करेंगे? मुझे दूसरे प्रश्न से लिंक करने में कोई आपत्ति नहीं है, लेकिन यहाँ बहुत सारे mods तो SO के साथ क्रॉस लिंकिंग उत्तरों के बारे में भी परेशान हैं।
डॉन पी

मैं वास्तव में प्यार करता था, लेकिन फिर, आखिरी बार जब मैंने ऐसा करने की कोशिश की, तो मुझे जवाबों की नकल करने के लिए फटकार लगाई गई।
वॉले
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.