我需要将我的Flutter网络应用发布到网络服务器文件夹中。
下面是index.html文件:
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
For more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
This is a placeholder for base href that will be replaced by the value of
the `--base-href` argument provided to `flutter build`.
-->
<base href="/freelife/">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="capenergy_ns">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<!-- Favicon -->
<link rel="icon" type="image/png" href="favicon.png"/>
<title>Freelife</title>
<link rel="manifest" href="manifest.json">
<script>
// The value below is injected by flutter build, do not touch.
var serviceWorkerVersion = null;
</script>
<!-- This script adds the flutter initialization JS code -->
<script src="flutter.js" defer></script>
</head>
<body>
<script>
window.addEventListener('load', function(ev) {
// Download main.dart.js
_flutter.loader.loadEntrypoint({
serviceWorker: {
serviceWorkerVersion: serviceWorkerVersion,
}
}).then(function(engineInitializer) {
return engineInitializer.initializeEngine();
}).then(function(appRunner) {
return appRunner.runApp();
});
});
</script>
<script src="https://www.gstatic.com/firebasejs/8.4.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.4.1/firebase-messaging.js"></script>
<script>
const firebaseConfig = {
apiKey: "AIz...",
authDomain: "fre...",
projectId: "fre...",
storageBucket: "free...",
messagingSenderId: "53...",
appId: "1:538....",
measurementId: "G-X..."
};
firebase.initializeApp(firebaseConfig);
</script>
<script src="main.dart.js" type="application/javascript"></script>
<script>
if ("serviceWorker" in navigator) {
window.addEventListener("load", function () {
navigator.serviceWorker.register("firebase-messaging-sw.js");
});
}
</script>
</body>
</html>
下面是firebase-messaging-sw.js:
importScripts("https://www.gstatic.com/firebasejs/9.12.1/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/9.12.1/firebase-messaging.js");
firebase.initializeApp({
apiKey: "AIz...",
authDomain: "free...",
projectId: "free...",
storageBucket: "free...",
messagingSenderId: "53...",
appId: "1:53...",
measurementId: "G-X..."
});
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
const promiseChain = clients
.matchAll({
type: "window",
includeUncontrolled: true
})
.then(windowClients => {
for (let i = 0; i < windowClients.length; i++) {
const windowClient = windowClients[i];
windowClient.postMessage(payload);
}
})
.then(() => {
return registration.showNotification("New Message");
});
return promiseChain;
});
self.addEventListener('notificationclick', function (event) {
console.log('notification received: ', event)
});
问题是在应用程序的构建文件夹内发布创建的Web文件夹,在浏览器中启动Web时显示空白页面。
查看Web控制台调试器的输出,它会抛出很多错误:
在我插入所有Firebase依赖项之前,Web应用程序工作正常。
2条答案
按热度按时间watbbzwu1#
尝试从index.html文件中删除[base href="/freelife/"]它应该保持这样。
igetnqfo2#
我已经解决了更改index.html的问题,如下所示:
然后在main.dart上,我更新了这段代码: