Windows UWP 应用程序生命周期:如何防止在 JS/HTML/CSS 应用程序中重新加载 [英] Windows UWP application lifecycle: how to prevent reload in JS/HTML/CSS app
问题描述
我有一个用 HTML/JS/CSS 构建的简单 UWP 应用程序.它本质上是一个网站，将一些数据加载到 webview 中等等，没什么特别的.
I have a simple UWP application built in HTML/JS/CSS. It is essentially a website, that loads some data into webview and so on, nothing out of ordinary.
我挣扎的是应用程序的生命周期及其恢复"状态，应用程序已经在运行，用户再次打开应用程序，然后整个应用程序被重新渲染，所有的 html+js 都可以再次运行这基本上会导致重新加载(就像通过 F5 一样).我该如何预防?
What I struggle with is the application lifecycle and its "resuming" state, where is the application has been already running, and user opens the application again, then the whole application is re-rendered, all the html+js gets to run again which is causing basically a reload (just like via F5). How do I prevent it?
这是非常基本的 main.js 文件，请注意我将之前的执行状态与应用程序执行状态正在运行"进行比较的那一行.我认为我应该做一些事情来防止我的应用程序重新加载(或换句话说重新渲染)，因此它不会再次经历初始化过程.只是看起来很糟糕，因为所有资源都重新加载了.
Here is the very basic main.js file, and please note the line where I compare the previous execution state with the application execution state "running". I reckon there is something I should do in order to prevent the reload of my app (or re-render in other words), so it doesn't go through the initialization process again. It just looks bad as all the resources are being loaded again.
(function () {
"use strict";
var app = WinJS.Application;
var activation = Windows.ApplicationModel.Activation;
var isFirstActivation = true;
app.onactivated = function (args) {
if (args.detail.kind === activation.ActivationKind.voiceCommand) {
// TODO: Handle relevant ActivationKinds. For example, if your app can be started by voice commands,
// this is a good place to decide whether to populate an input field or choose a different initial view.
}
else if (args.detail.kind === activation.ActivationKind.launch) {
// A Launch activation happens when the user launches your app via the tile
// or invokes a toast notification by clicking or tapping on the body.
if (args.detail.arguments) {
// TODO: If the app supports toasts, use this value from the toast payload to determine where in the app
// to take the user in response to them invoking a toast notification.
}
else if (args.detail.previousExecutionState === activation.ApplicationExecutionState.terminated) {
// TODO: This application had been suspended and was then terminated to reclaim memory.
// To create a smooth user experience, restore application state here so that it looks like the app never stopped running.
// Note: You may want to record the time when the app was last suspended and only restore state if they've returned after a short period.
}
else if (args.detail.previousExecutionState === activation.ApplicationExecutionState.running) {
isFirstActivation = false;
}
}
if (!args.detail.prelaunchActivated) {
// TODO: If prelaunchActivated were true, it would mean the app was prelaunched in the background as an optimization.
// In that case it would be suspended shortly thereafter.
// Any long-running operations (like expensive network or disk I/O) or changes to user state which occur at launch
// should be done here (to avoid doing them in the prelaunch case).
// Alternatively, this work can be done in a resume or visibilitychanged handler.
}
if (isFirstActivation) {
// TODO: The app was activated and had not been running. Do general startup initialization here.
document.addEventListener("visibilitychange", onVisibilityChanged);
args.setPromise(WinJS.UI.processAll().then(function(){ WinJS.UI.enableAnimations();}));
}
isFirstActivation = false;
};
function onVisibilityChanged(args) {
if (!document.hidden) {
// TODO: The app just became visible. This may be a good time to refresh the view.
}
}
app.oncheckpoint = function (args) {
// TODO: This application is about to be suspended. Save any state that needs to persist across suspensions here.
// You might use the WinJS.Application.sessionState object, which is automatically saved and restored across suspension.
// If you need to complete an asynchronous operation before your application is suspended, call args.setPromise().
};
app.start();
})();
推荐答案
好的，经过一段时间的调试和前后重写应用程序，我意识到这里的罪魁祸首是应用程序清单中的StartPage".
Ok, so after some time of debugging and rewriting the application front and back, I've realized that the culprit here was the "StartPage" in the application manifest.
之前处于运行状态的应用程序被重新加载"的问题是由于用户每次重新打开应用程序后都会触发app.Start()"造成的.但是来自 UWP 示例工具包的示例没有受到这种行为的影响，我注意到app.Start()"仅在应用程序实际启动时被触发一次.之后的每个打开都不再像我的应用程序那样到达那个点(到app.Start()").
The problem with application being "re-loaded" even if it was in the running state before was caused by the "app.Start()" being triggered each time after user re-opened the application. But samples from the UWP samples kit didn't suffer from this behavior, and I've noticed that the "app.Start()" is being triggered only once, when the application was actually started. Each subsequent opening didn't get to that point anymore (to "app.Start()") like in my app.
以前，由于 内容安全策略 问题.但是将这个值与样本进行比较，他们使用StartPage=index.html"让我认为这可能是问题所在，我是对的.我花了几个小时来确保我没有收到任何与内容安全策略相关的错误(替换了内联脚本)，但它最终奏效了.
Previously, I had this value to set StartPage="ms-appx-web:///index.html" due to Content Security Policy problem. But comparing this value with the samples, they used "StartPage=index.html" made me think that might be the problem and I was right. It took me couple of hours to make sure I don't get any content security policy related errors (inline scripts replaced) but it eventually worked.
我无法解释为什么StartPage='ms-appx-web:///index.html'"导致应用程序每次都重新启动，而StartPage='index.html'"是正确保持其状态，但它确实解决了我的问题.
I can't explain why the "StartPage='ms-appx-web:///index.html'" causes the application to be re-started each time, whereas "StartPage='index.html'" is correctly maintaining its state, but it did resolve my problem.
这篇关于Windows UWP 应用程序生命周期:如何防止在 JS/HTML/CSS 应用程序中重新加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
