Android关于H5页面获取App原生本地资源的实现

在日常的项目业务中,前端H5页面经常会频繁用到一些固定的资源,而且有时这个资源的文件相对比较大。H5页面加载的过程中,如果需要加载类似这种资源,就会非常影响页面的加载速度。
这时就需要把这些资源提前放到原生App本地,或者App预加载好。当H5页面需要加载这个资源时,通过制定的协议地址加载。App通过拦截资源加载地址进行判断,返回指定的资源响应。
以H5页面获取App的字体文件资源为例:

1、制定协议地址: myapp://native/resource?type=resourceType&name=resourceName
2、H5直接引用协议资源地址:
@font-face {
  font-family: 'sans-serif';
  src: url('myapp://native/resource?type=font&name=sans-serif');
  font-weight: normal;
  font-style: normal;
}
3、App的WebView复写onShouldInterceptRequest方法拦截:
 override fun onShouldInterceptRequest(view: WebView?, request: WebResourceRequest?): WebResourceResponse? {
     val url = request?.url.toString()
     if (url.startsWith("myapp://native/resource")) {
       return  WebRequestNativeResourceUtils.requestNativeResource(url)
     }
     return null
 }

WebRequestNativeResourceUtils代码:

object WebRequestNativeResourceUtils {

	private const val RESOURCE_KEY_TYPE = "type"
	private const val RESOURCE_KEY_NAME = "name
	private const val RESOURCE_TYPE_FONT = "font"
	private const val RESOURCE_FONT_SAN_SERIF = "sans-serif
    
	fun requestNativeResource(url: String): WebResourceResponse? {
	        val queries = URIHelper.getQueryMap(URI(url))
	        val resourceType = queries[RESOURCE_KEY_TYPE]
	        val resourceName = queries[RESOURCE_KEY_NAME]
	        return when (resourceType) {
	            RESOURCE_TYPE_FONT -> {
	                getFontResource(resourceName)
	            
	            else -> {
	                null
	            }
	        }

	private fun getFontResource(resourceName: String?): WebResourceResponse? {
	      var resourceStream: InputStream? = null
	      when (resourceName) {
	          RESOURCE_FONT_SAN_SERIF -> {
	              resourceStream = AppUtils.getAppContext().assets.open("fonts/SourceHanSerifCN-SemiBold.otf")
	          }
	          else -> {}
	      }
	      return resourceStream?.let {
	         val responseHeaders = java.util.HashMap<String, String>();
	         responseHeaders["Access-Control-Allow-Origin"] = "*";
	         WebResourceResponse("font/otf", "utf-8", 200, "ok", responseHeaders, it)
	      }
	  }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值