Fa應用是支持WebView嵌入H5網頁的件炉，WebView提供在應用中集成Web頁面的能力,不過目前只支持Java模板的WebView。
WebView的使用方法
WebView派生于通用組件Component，可以像普通組件一樣進行使用览露。
方式一：
- 在layout目錄下的xml文件中創(chuàng)建WebView荧琼。
<ohos.agp.components.webengine.WebView
ohos:id="$+id:webview"
ohos:height="match_parent"
ohos:width="match_parent">
</ohos.agp.components.webengine.WebView>
2.在MainAbility.java文件中，使用load方法加載Web頁面差牛。
WebView webView = (WebView) findComponentById(ResourceTable.Id_webview);
webView.getWebConfig() .setJavaScriptPermit(true); // 如果網頁需要使用JavaScript命锄，增加此行；如何使用JavaScript下文有詳細介紹
final String url = EXAMPLE_URL; // EXAMPLE_URL由開發(fā)者自定義
webView.load(url);
方式二：
1.在ComponentContainer中創(chuàng)建WebView偏化。
WebView webView = new WebView(getContext());
webView.setWidth(ComponentContainer.LayoutConfig.MATCH_PARENT);
webView.setHeight(ComponentContainer.LayoutConfig.MATCH_PARENT);
webView.getWebConfig() .setJavaScriptPermit(true); // 如果網頁需要使用JavaScript脐恩，增加此行；如何使用JavaScript下文有詳細介紹
addComponent(webView);
2.加載Web頁面侦讨。
final String url = EXAMPLE_URL; // EXAMPLE_URL由開發(fā)者自定義
webView.load(url);
定制網址加載行為
當Web頁面進行鏈接跳轉時驶冒，WebView默認會打開目標網址，通過以下方式可以定制該行為韵卤。
- 自定義WebAgent對象骗污。
private class ExampleWebAgent extends WebAgent {
@Override
public boolean isNeedLoadUrl(WebView webView, ResourceRequest request) {
Uri uri = request.getRequestUrl();
if (EXAMPLE_URL.equals(uri.getDecodedHost())) {
// 由WebView通過默認方式處理
return false;
}
// 增加開發(fā)者自定義邏輯
return super.isNeedLoadUrl(webView, request);
}
}
2.設置自定義WebAgent至WebView。
webView.setWebAgent(new ExampleWebAgent());
瀏覽網頁歷史記錄
- 通過getNavigator方法獲取Navigator對象沈条。
Navigator navigator = webView.getNavigator();
2.使用canGoBack()或canGoForward()檢查是否可以向后或向前瀏覽需忿，使用goBack()或goForward()向后或向前瀏覽。
if (navigator.canGoBack()) {
navigator.goBack();
}
if (navigator.canGoForward()) {
navigator.goForward();
}
使用JavaScript
通過以下方式，可以建立應用和頁面間的JavaScript調用屋厘。
- 通過WebConfig啟用JavaScript涕烧。
webView.getWebConfig().setJavaScriptPermit(true);
2.根據(jù)實際需要選擇調用方式。
注入回調對象到頁面內容汗洒，并在頁面中調用該對象议纯。
final String jsName = "JsCallbackToApp";
webview.addJsCallback(jsName, new JsCallback() {
@Override
public String onCallback(String msg) {
// 增加自定義處理
return "jsResult";
}
});
在頁面內通過JavaScript代碼調用注入對象。
function callToApp() {
if (window.JsCallbackToApp && window.JsCallbackToApp.call) {
var result = JsCallbackToApp.call("message from web");
}
}
在應用內調用頁面內的JavaScript方法仲翎。
webview.executeJs("javascript:callFuncInWeb()", new AsyncCallback<String>() {
@Override
public void onReceive(String msg) {
// 在此確認返回結果
}
});
觀測Web狀態(tài)
通過setWebAgent方法設置自定義WebAgent對象痹扇，以觀測頁面狀態(tài)變更等事件：
webview.setWebAgent(new WebAgent() {
@Override
public void onLoadingPage(WebView webView, String url, PixelMap favicon) {
super.onLoadingPage(webView, url, favicon);
// 頁面開始加載時自定義處理
}
@Override
public void onPageLoaded(WebView webView, String url) {
super.onPageLoaded(webView, url);
// 頁面加載結束后自定義處理
}
@Override
public void onLoadingContent(WebView webView, String url) {
super.onLoadingContent(webView, url);
// 加載資源時自定義處理
}
@Override
public void onError(WebView webView, ResourceRequest request, ResourceError error) {
super.onError(webView, request, error);
// 發(fā)生錯誤時自定義處理
}
});
觀測瀏覽事件
通過setBrowserAgent方法設置自定義BrowserAgent對象，以觀測JavaScript事件及通知等：
webview.setBrowserAgent(new BrowserAgent(this) {
@Override
public void onTitleUpdated(WebView webView, String title) {
super.onTitleUpdated(webView, title);
// 標題變更時自定義處理
}
@Override
public void onProgressUpdated(WebView webView, int newProgress) {
super.onProgressUpdated(webView, newProgress);
// 加載進度變更時自定義處理
}
});
加載資源文件或本地文件
出于安全考慮溯香，WebView不支持直接通過File協(xié)議加載資源文件或本地文件鲫构，如應用需實現(xiàn)相關業(yè)務，可參考如下方式實現(xiàn)玫坛。
方式一：通過processResourceRequest方法訪問文件
- 通過setWebAgent方法設置自定義WebAgent對象结笨，覆寫processResourceRequest方法。
webview.setWebAgent(new WebAgent() {
@Override
public ResourceResponse processResourceRequest(WebView webView, ResourceRequest request) {
final String authority = "example.com";
final String rawFile = "/rawfile/";
final String local = "/local/";
Uri requestUri = request.getRequestUrl();
if (authority.equals(requestUri.getDecodedAuthority())) {
String path = requestUri.getDecodedPath();
if (TextTool.isNullOrEmpty(path)) {
return super.processResourceRequest(webView, request);
}
if (path.startsWith(rawFile)) {
// 根據(jù)自定義規(guī)則訪問資源文件
String rawFilePath = "entry/resources/rawfile/" + path.replace(rawFile, "");
String mimeType = URLConnection.guessContentTypeFromName(rawFilePath);
try {
Resource resource = getResourceManager().getRawFileEntry(rawFilePath).openRawFile();
ResourceResponse response = new ResourceResponse(mimeType, resource, null);
return response;
} catch (IOException e) {
HiLog.info(TAG, "open raw file failed");
}
}
if (path.startsWith(local)) {
// 根據(jù)自定義規(guī)則訪問本地文件
String localFile = getContext().getFilesDir() + path.replace(local, "/");
HiLog.info(TAG, "open local file " + localFile);
File file = new File(localFile);
if (!file.exists()) {
HiLog.info(TAG, "file not exists");
return super.processResourceRequest(webView, request);
}
String mimeType = URLConnection.guessContentTypeFromName(localFile);
try {
InputStream inputStream = new FileInputStream(file);
ResourceResponse response = new ResourceResponse(mimeType, inputStream, null);
return response;
} catch (IOException e) {
HiLog.info(TAG, "open local file failed");
}
}
}
return super.processResourceRequest(webView, request);
}
});
2.加載資源文件或本地文件湿镀。
// 加載資源文件 resources/rawfile/example.html
webView.load("https://example.com/rawfile/example.html");
// 加載本地文件 /data/data/com.example.dataability/files/example.html
webView.load("https://example.com/local/example.html");
方式二：通過Data Ability訪問文件
1.創(chuàng)建Data Ability炕吸。
public class ExampleDataAbility extends Ability {
private static final String PLACEHOLDER_RAW_FILE = "/rawfile/";
private static final String PLACEHOLDER_LOCAL_FILE = "/local/";
private static final String ENTRY_PATH_PREFIX = "entry/resources";
@Override
public RawFileDescriptor openRawFile(Uri uri, String mode) throws FileNotFoundException {
final int splitChar = '/';
if (uri == null) {
throw new FileNotFoundException("Invalid Uri");
}
// path will be like /com.example.dataability/rawfile/example.html
String path = uri.getEncodedPath();
final int splitIndex = path.indexOf(splitChar, 1);
if (splitIndex < 0) {
throw new FileNotFoundException("Invalid Uri " + uri);
}
String targetPath = path.substring(splitIndex);
if (targetPath.startsWith(PLACEHOLDER_RAW_FILE)) {
// 根據(jù)自定義規(guī)則訪問資源文件
try {
return getResourceManager().getRawFileEntry(ENTRY_PATH_PREFIX + targetPath).openRawFileDescriptor();
} catch (IOException e) {
throw new FileNotFoundException("Not found support raw file at " + uri);
}
} else if (targetPath.startsWith(PLACEHOLDER_LOCAL_FILE)) {
// 根據(jù)自定義規(guī)則訪問本地文件
File file = new File(getContext().getFilesDir(), targetPath.replace(PLACEHOLDER_LOCAL_FILE, ""));
if (!file.exists()) {
throw new FileNotFoundException("Not found support local file at " + uri);
}
return getRawFileDescriptor(file, uri);
} else {
throw new FileNotFoundException("Not found support file at " + uri);
}
}
private RawFileDescriptor getRawFileDescriptor(File file, Uri uri) throws FileNotFoundException {
try {
final FileDescriptor fileDescriptor = new FileInputStream(file).getFD();
return new RawFileDescriptor() {
@Override
public FileDescriptor getFileDescriptor() {
return fileDescriptor;
}
@Override
public long getFileSize() {
return -1;
}
@Override
public long getStartPosition() {
return 0;
}
@Override
public void close() throws IOException {
}
};
} catch (IOException e) {
throw new FileNotFoundException("Not found support local file at " + uri);
}
}
}
2.在config.json中注冊Data Ability。
{
"name": "com.example.webview.ExampleDataAbility",
"type": "data",
"uri": "dataability://com.example.dataability",
"metaData": {
"customizeData": [
{
"name": "com.example.provider",
"extra": "$profile:path"
}
]
}
}
以及在resources/base/profile目錄新增path.xml：
<paths>
<root-path name="root" path="/" />
</paths>
3.配置支持訪問Data Ability資源勉痴。
webConfig.setDataAbilityPermit(true);
4.通過dataability協(xié)議加載資源文件或本地文件赫模。
// 加載資源文件 resources/rawfile/example.html
webView.load("dataability://com.example.dataability/rawfile/example.html");
// 加載本地文件 /data/data/com.example.dataability/files/example.html
webView.load("dataability://com.example.dataability/local/example.html");
