WebView 的資料交換

1 篇文章 / 0 new
author
WebView 的資料交換
app 內部要與 webView 內頁面進行資料交換, 則需透過 javascript 功能,用 webView.stringByEvaluatingJavaScript(from: javascriptString) 來進行, 範例如下
► 呼叫 js func, 假設頁面有一js fucn 為 resultSwift(), 擇要執行該 func 方法如下
let js = "resultSwift()";
webView.stringByEvaluatingJavaScript(from: js);

► 檢查目標物是否存在, 因與webView交握僅能是 String 無法傳遞 Object, 因此檢查是否取得所要物件就需透過func 間接來傳回狀態, 就可透過result 傳回值來判斷
let js = "function f(){ return document.querySelector('meta[name=viewport]')===null ? 'false':'true'; } f();";
if let result = webView.stringByEvaluatingJavaScript(from: js) { }

► 傳送/讀取值
1. 可透過網頁已寫好的 js func, 透過呼叫 func 來傳遞或取得值. 建議採用此法, 這樣 app 與 web 開發者才有良好介面而不會相互影響太緊密.
2. 直接取得物件進行填值, 如頁面有一 <input name="app" type="text" value="NG"/>, 則操作如下
let js = "var tar=document.querySelector('input[name=app]'); tar.value='app to web';";
let result = webView.stringByEvaluatingJavaScript(from: javascriptString);
result 也會回傳 ''app to web" 可藉此判斷是否傳遞成功
3. 取得目標值
var tar=document.querySelector('input[name=app]'); tar.value;";
let result = webView.stringByEvaluatingJavaScript(from: javascriptString);
這樣result就可以接收到該 input 目前值了

► 讀取 page 內的值, 如<title>xxxx</title>
webView.stringByEvaluatingJavaScript(from: "document.title");

► 取得 url參數
let urlComponents = URLComponents(url: request.url!, resolvingAgainstBaseURL: false);
let parameterWeWant = urlComponents?.queryItems?.filter({ $0.name == "參數名稱" }).first;
let paramValue:String = parameterWeWant?.value ?? "";
Free Web Hosting