本地存储API不NativeScript的WebView内工作

Question

我的应用程序是一个{N}的WebView内托管的Web应用程序。该用户名和密码都在localStore商店。当我离开的应用程序，并重新进入我没有数据，我要回去登录。

可能有人帮助我吗？或解释如何调试应用内的Web视图。该网页与角4与NativeScript应用程序开发。

Answer 1

借助Android localStorage的API将无法正常工作，直到你启用它们。你可以通过在负载情况下访问本机的WebView设置启用它。

export function onWebViewLoaded(args) {
    const webView = args.object;
    if (webView.android) {
        webView.android.getSettings().setDomStorageEnabled(true);
        webView.android.getSettings().setDatabaseEnabled(true);
    }
}

Playground Sample

之间，是否可以localStorage保存机密信息，如用户名/密码，这里是一个不同的问题。我的答案是否定的，因为它很容易/开放存取您不能使用它。一般来说，你应该打与用户给出这些凭据登录API，你应该得到access token你将任何通信随后使用与服务器。你可以将此令牌存储在您localStoage，明确它在注销。

Answer 2

很好，谢谢！！例子效果很好。

html的

<Page (loaded)="pageLoaded($event)">
        <GridLayout rows="*" columns="*">
           <WebView  #myWebView [src]="webViewSrc" (loadStarted)="onWebViewLoadStarted($event)"></WebView>
        </GridLayout>
</Page>

-component（TS文件）

import { Component, OnInit, AfterViewInit, ViewChild, ElementRef } from "@angular/core";

@Component({
    selector: "Home",
    moduleId: module.id,
    templateUrl: "./home.component.html",
    styleUrls:['./home.component.css']
})
export class HomeComponent  {
   public webViewSrc: string = URL;
    constructor(private routerExtensions: RouterExtensions) {
        // Use the component constructor to inject providers.
    }

    onWebViewLoaded(args){
        const webView = args.object;
        if (webView.android) {
            webView.android.getSettings().setDatabaseEnabled(true);
            webView.android.getSettings().setLoadWithOverviewMode(true);
        }
    }
    pageLoaded(args: EventData) {
        let page = <Page>args.object;
        page.bindingContext = new HomeViewModel();
    }
}