javascript 在inApp浏览器中注入代码并在应用程序中获取它的返回值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16517693/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Inject code in inApp browser and get it's return value in the app
提问by Oliver
I am writing a phonegap app, that's starting a web app inside an inAppBrowser. I would like to get certain feedback from this web app to use it further in my phonegap app.
我正在编写一个 phonegap 应用程序，它在 inAppBrowser 中启动一个网络应用程序。我想从这个网络应用程序中获得某些反馈，以便在我的 phonegap 应用程序中进一步使用它。
So the user starts the web app, does some things there and upon clicking a button, the web app returns a value to the phonegap app.
所以用户启动网络应用程序，在那里做一些事情，点击一个按钮后，网络应用程序将一个值返回给 phonegap 应用程序。
I thought I could use the executeScript method of the inAppBrowser to inject a function, that would be called inside the web app using some event, and when that function is called, evaluate its return value inside the web app. All I found was the not very complete documentation of phonegap and this question on stackoverflow: Augmenting a webapp with native capabilities - Bridging PhoneGap's InAppBrowser with Rails web app application javascript
我想我可以使用 inAppBrowser 的 executeScript 方法来注入一个函数，该函数将使用某个事件在 Web 应用程序内部调用，当调用该函数时，在 Web 应用程序内部评估其返回值。我发现的只是 phonegap 的不太完整的文档和关于 stackoverflow 的这个问题： Augmenting a webapp with native capabilities - Bridging PhoneGap's InAppBrowser with Rails web app application javascript
Sadly it does not work as I expected, because the callback function fires imediately, without waiting for the injected function to execute.
遗憾的是，它并没有像我预期的那样工作，因为回调函数会立即触发，而无需等待注入的函数执行。
Here is my mobile app code
这是我的移动应用程序代码
<!DOCTYPE html>
<html>
<head>
<title>InAppBrowser.executeScript Example</title>
<script type="text/javascript" charset="utf-8" src="cordova-2.7.0.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for Cordova to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// Global InAppBrowser reference
var iabRef = null;
// Inject our custom JavaScript into the InAppBrowser window
//
function addFeebackFunction() {
iabRef.executeScript(
{code: "var evaluateFeedback = function(){return 'Done';};"},
function(data) {
alert(data);
}
);
//iabRef.close();
}
function iabClose(event) {
iabRef.removeEventListener('loadstop', addFeebackFunction);
iabRef.removeEventListener('exit', iabClose);
}
// Cordova is ready
//
function onDeviceReady() {
iabRef = window.open('http://{ipaddress}/test/', '_blank', 'location=no');
iabRef.addEventListener('loadstop', addFeebackFunction);
iabRef.addEventListener('exit', iabClose);
}
</script>
</head>
<body>
<h1>Mobile App</h1>
</body>
</html>
And her is my web app code
她是我的网络应用程序代码
<!DOCTYPE HTML>
<html>
<head>
<title>
Test
</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#get-feedback').click(function() {
var feedback = $('#feedback').val();
evaluateFeedback(feedback);
});
});
</script>
</head>
<body>
<div data-role="page">
<article data-role="content">
<h1>Web app</h1>
<input type="text" id="feedback" /><br />
<button type="button" id="get-feedback">Feedback</button>
</article>
</div>
</body>
</html>
回答by Jonathan Adami
Just a wild guess, but you're not executing this function...
只是一个疯狂的猜测，但你没有执行这个功能......
{code: "var evaluateFeedback = function(){return 'Done';};evaluateFeedback();"}
{代码：“var evaluateFeedback = function(){return 'Done';};evaluateFeedback();”}
or better: {code: "'Done';"}
或者更好：{代码：“'完成'；”}
回答by Abdulqadir_WDDN
ref.addEventListener('loadstart', function(event){
//alert('start: ' + event.url);
});
ref.addEventListener('loadstop', function(event){
//alert('stop: ' + event.url);
});
ref.addEventListener('loaderror', function(event){
//alert('error: ' + event.message);
});
ref.addEventListener('exit', function(event){
});
Use above for events for taking return value back in the application
使用上面的事件在应用程序中取回返回值
回答by ABCD.ca
In the codestring value, define a function and call it. The return value will come back in the callback's argument (or in ngCordova as the promise' resolved argument). Thanks to @Jonathan Adami for the suggestion.
在code字符串值中，定义一个函数并调用它。返回值将在回调的参数中返回（或在 ngCordova 中作为 promise 的已解析参数）。感谢@Jonathan Adami 的建议。
