Android WebView加载 Vue 项目

最新推荐文章于 2025-05-23 13:04:06 发布

原创最新推荐文章于 2025-05-23 13:04:06 发布 · 1.1w 阅读

11 ·

CC 4.0 BY-SA版权

文章标签：

#传参 #localStorage

Android 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍如何在Android WebView中启用localStorage，实现Vue应用的数据持久化，并通过URL参数向Vue前端传递数据，确保本地存储的有效利用及跨平台数据通信。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.允许 vue端使用 localStorage存储

需要在 android webview 中作如下设置

        myWebView.loadUrl("http://10.18.31.12:8081/?areaCode=620000&areaName=甘肃省");        
        //localStorage  允许存储
        myWebView.getSettings().setDomStorageEnabled(true);
        myWebView.getSettings().setAppCacheMaxSize(1024*1024*8);//存储的最大容量
        String appCachePath = getApplicationContext().getCacheDir().getAbsolutePath();
        myWebView.getSettings().setAppCachePath(appCachePath);
        myWebView.getSettings().setAllowFileAccess(true);
        myWebView.getSettings().setAppCacheEnabled(true);

2.向vue端传递参数

android 端webView 拼接参数

myWebView.loadUrl("http://10.18.31.12:8081/?areaCode=620000&areaName=甘肃省");

vue首页面接收参数并存储到 localStorage

created(){
    var params = {};
    location.search.substr(1).split('&').forEach( function(item){
      var s = item.split('=');
      params[s[0]]=s[1];
    });
    localStorage.setItem('areaCode',params.areaCode);
    localStorage.setItem('areaName',params.areaName);
}