在告訴Node.js繼續執行代碼之前，我將如何等待子進程完成？

Question

因此，我正在構建一個Electron and React App。 我正在使用ghost-script創建某些pdf文件的img，我想知道如何告訴Node.js在打開窗口並更改App中的狀態之前等待img創建。 這些img被用作組件的src，並且當組件嘗試加載img時，它會保留一個損壞的狀態，因為狀態更新時img src不存在。

 // this is where I set the state before sending all the data to the renderer process(the front end of the App) function getStateReady(theState, event) { let pdfFiles = scanDirectory(currentDir); let pdfNames = getPdfName(pdfFiles); imageUrls = getImgName(pdfFiles); console.log(imageUrls); createImg(pdfFiles, pdfNames); switch (theState) { case 'initialState': mainWindow.webContents.on('did-finish-load', () => { mainWindow.webContents.send('initialState', pdfFiles, imageUrls); }) break; case 'secondState-reply': event.sender.send('secondState-reply', pdfFiles, imageUrls); break; default: console.log('a param was missing'); } } //these to functions take a pdf file path and its name to create an img function createImg(pdfPaths, pdfNames) { pdfNames.forEach((item, index) => { if(fs.existsSync(path.join(rootDirectory, 'src', 'imgs', item.replace('.pdf', '.jpg')))) { console.log('image exists'); } else { console.log("creating image"); child(returnProcess(pdfPaths[index], item), (err, stdout) => { if(err) { console.log(err) } console.log(stdout) }) } }) } function returnProcess(pdfPath, pdfName) { let newPdf = `"${pdfPath}"` let output = `"${path.join(rootDirectory, 'src', 'imgs', pdfName.replace('.pdf', '.jpg'))}"`; let mainProcess = `"C:\\\\Program Files\\\\gs\\\\gs9.23\\\\bin\\\\gswin64c.exe" -q -o ${output} -sDEVICE=pngalpha -dLastPage=1 ${newPdf}` return mainProcess; } 

Answer 1

我不確定代碼和邏輯，也從未使用過虛腳本，但是在這里我可以建議使用回調函數來解決此問題。 基本上將回調函數傳遞給createImg方法並執行該回調函數，這將告訴NodeJS該過程已完成，前端應能夠顯示創建的圖像。

下面是更新代碼。

 // this is where I set the state before sending all the data to the renderer process(the front end of the App) function getStateReady(theState, event) { let pdfFiles = scanDirectory(currentDir); let pdfNames = getPdfName(pdfFiles); imageUrls = getImgName(pdfFiles); console.log(imageUrls); createImg(pdfFiles, pdfNames, function (){ switch (theState) { case 'initialState': mainWindow.webContents.on('did-finish-load', () => { mainWindow.webContents.send('initialState', pdfFiles, imageUrls); }) break; case 'secondState-reply': event.sender.send('secondState-reply', pdfFiles, imageUrls); break; default: console.log('a param was missing'); } }); } //these to functions take a pdf file path and its name to create an img function createImg(pdfPaths, pdfNames, fun) { pdfNames.forEach((item, index) => { if(fs.existsSync(path.join(rootDirectory, 'src', 'imgs', item.replace('.pdf', '.jpg')))) { console.log('image exists'); } else { console.log("creating image"); child(returnProcess(pdfPaths[index], item), (err, stdout) => { if(err) { console.log(err) } console.log(stdout) }) } }) // call the callback function fun.call(); } function returnProcess(pdfPath, pdfName) { let newPdf = `"${pdfPath}"` let output = `"${path.join(rootDirectory, 'src', 'imgs', pdfName.replace('.pdf', '.jpg'))}"`; let mainProcess = `"C:\\\\Program Files\\\\gs\\\\gs9.23\\\\bin\\\\gswin64c.exe" -q -o ${output} -sDEVICE=pngalpha -dLastPage=1 ${newPdf}` return mainProcess; }