我是使用 Electron 和 Node JS 开发应用程序的新手，似乎遇到了 <webview src="https://app.example.com" nodeintegration preload="./app/js/preload.js"></webview> 的问题标签，还有我的 preload.js文件。
我最初在应用程序本地开发 HTML 和 javascript 文件，但现在我已将文件移动到 Web 服务器，旧的 renderer.js 有很多问题。职能。
我一直在玩编程，并设法让一些东西正常工作，但不是所有功能。就像退出应用程序一样，但最小化不起作用，可能只是我遗漏了一些东西。
我的 index.html 文件(应用程序的本地文件)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>n/a</title>
<link rel="stylesheet" href="app/css/style.css">
</head>
<body>
<!-- Load the VPN website -->
<webview id="odyssey-vpn" src="https://app.example.com/" nodeIntegration preload="./app/js/preload.js"></webview>
<!-- Fix issues with imports -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
<!-- Vendors -->
<script src="assets/vendors/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Fix issues with imports -->
<script>if (window.module) module = window.module;</script>
</body>
</html>
我的 preload.js 文件(应用程序的本地文件)
// Listen for contentLoaded
window.onload = function() {
// Require Preload Requirements
const { remote, ipcRenderer, shell } = require('electron')
//doesn't work
document.getElementById('minimize-button').addEventListener('click', () => {
remote.getCurrentWindow().minimize()
})
//doesn't work
document.getElementById('minmax-button').addEventListener('click', () => {
const currentWindow = remote.getCurrentWindow()
if (currentWindow.isMaximized()) {
currentWindow.unmaximize()
} else {
currentWindow.maximize()
}
})
// works
document.getElementById('exit-button').addEventListener('click', () => {
remote.app.quit()
})
};
我的 index.php 文件(在网络服务器上远程)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>n/a</title>
<!-- Fonts Styling -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="stylesheet" href="assets/vendors/bower_components/animate.css/animate.min.css">
<link rel="stylesheet" href="assets/vendors/bower_components/jquery.scrollbar/jquery.scrollbar.css">
<link rel="stylesheet" href="assets/vendors/bower_components/select2/dist/css/select2.min.css">
<link rel="stylesheet" href="assets/css/app.min.css">
<link rel="stylesheet" href="assets/css/custom.css">
<link rel="stylesheet" href="assets/css/window.css">
<link rel="stylesheet" href="assets/css/mng.css">
<!-- Firebase -->
<script src="https://www.gstatic.com/firebasejs/5.8.0/firebase.js"></script>
</head>
<body data-ma-theme="indigo">
<div id="title-bar-login" class="mng-row">
<div class="col-md-6 btns-off"></div>
<div class="col-md-6 btns-on">
<div id="title-bar-btns">
<button id="minimize-button" class="window-button btn">
<i class="fas fa-fw fa-window-minimize" style="font-size: 0.9rem;"></i>
</button>
<button id="minmax-button" class="window-button btn">
<i class="far fa-fw fa-window-maximize" style="font-size: 0.9rem;"></i>
</button>
<button id="exit-button" class="window-button btn">
<i class="fas fa-fw fa-times" style="font-size: 0.9rem;"></i>
</button>
</div>
</div>
</div>
<div class="scrollbar">
<main class="main">
<div class="mng-row">
<div class="col-md-6 mng-col">
<div class="mng-inner" id="mng-replacement"></div>
</div>
<div class="col-md-6 mng-col bg-indigo">
<div class="mng-inner" id="newUpdate">
<a href="index.html">
<div class="icon">
<i class="fa fa-fw fa-wifi"></i>
</div>
<h1 class="logo display-4">
<strong></strong>
</h1>
</a>
</div>
</div>
</main>
</div>
<div class="modal fade" id="modal-updates" tabindex="-1" style="display: none;" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title pull-left">Changelog</h5>
</div>
<div class="modal-body">
See changes in our most recent versions of the application.
<hr>
<ul id="updateLog" class="list list--check">
</ul>
</div>
<div class="modal-footer">
<button type="button" id="restart-button" class="btn btn-link">Restart</button>
<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Vendors -->
<script src="assets/vendors/bower_components/jquery/dist/jquery.min.js"></script>
<script src="assets/vendors/bower_components/popper.js/dist/umd/popper.min.js"></script>
<script src="assets/vendors/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="assets/vendors/bower_components/jquery.scrollbar/jquery.scrollbar.min.js"></script>
<script src="assets/vendors/bower_components/jquery-scrollLock/jquery-scrollLock.min.js"></script>
<script src="assets/vendors/bower_components/select2/dist/js/select2.full.js"></script>
<script src="assets/vendors/bower_components/remarkable-bootstrap-notify/dist/bootstrap-notify.min.js"></script>
<!-- App functions and actions -->
<script src="assets/js/custom.js"></script>
<script src="assets/js/app.min.js"></script>
</body>
</html>
感谢所有提供帮助的人，我真的很感激!
最佳答案
Electron Github 上似乎有一个 Unresolved 问题，我的代码都是正确的。 https://github.com/electron/electron/issues/16558
关于javascript - Electron preload.js 没有按照预期的方式运行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54412645/