iOS WKWebView加载本地html

html-css013

iOS WKWebView加载本地html,第1张

1、将html文件夹拖入项目根目录下,选择引用(蓝色文件夹)

2、获取index.html所在的路径

3、webView调用loadFileURL:allowingReadAccessToURL:方法加载

如果需要拼接额外参数,需要手动拼接地址,直接用fileURLWithPath生成的链接,会进行编码

NSString *basePath = [NSString stringWithFormat: @"%@/%@", [[NSBundle mainBundle] bundlePath], @"index.html所在的文件夹"]

NSURL *baseUrl = [NSURL fileURLWithPath: basePath isDirectory: YES]

NSString *filePath = [NSString stringWithFormat: @"file://%@/index.html#/?xxx=%@&sss=%@", basePath, @"xxx", @"sss"]

NSURL *fileUrl = [NSURL URLWithString: filePath]

[_webView loadFileURL: fileUrl allowingReadAccessToURL: baseUrl]

Android在webview下加载本地网页的方式首先,在src目录下面新建一个assets目录,之后新建一个web资源的根目录,如下图所示:这里的Web目 录名可以任意起,但是必须有这一层,否则可能拿不到资源之后再webview中加载资源: webView.loadUrl("file:///android_asset/web/index.html") //注意一点,目录名是assets,资源路径中是asset

最近项目中,用到了flutter中的webview加载带有echarts控件的html文件,但是发现图表一直无法显示,通过查询相关资料,分析apk包文件,知道了是由于flutter项目中的文件打包后的路径发生变化,造成找不到相关依赖,特此记录一下,使用下面这个方法便可以解析出Android和IOS打包后的apk中资源文件的实际位置。 例如,你的资源文件是在flutter项目的根目录下的 'assets/files/echart-pie.html', 那 'getAssetsPath('assets/files/echart-pie.html')'才是打包成apk后,资源文件的实际路径。 按照上面的操作,你会发现在android设备上已经可以正常显示本地html页面了,但是IOS设备上还是一脸懵逼;不要慌,这块是由于webview_flutter本来就不支持加载本地文件,这时我们还需要修改下插件IOS部分的源码,FlutterWebView.m文件: 通过以上骚操作,就可以实现webview_flutter在android和ios设备上加载本地html文件了。 最后:推荐一个插件,已经在官方的基础上进行了优化webview_flutter_plus