【问题标题】:accessing Android API from browser从浏览器访问 Android API
【发布时间】:2013-11-06 01:20:42
【问题描述】:
我知道如果我使用嵌入式 WebView,我可以从 javascript 调用 android 原生 API。
但是,是否可以从 Android 中的常规浏览器(例如 Firefox Mobile 或普通浏览器)访问这些 API?我假设我必须在某处明确授予权限,否则这将是一个很大的安全漏洞。
我无法看到创建运行 javascript 的特殊应用程序的用途;我的应用程序是在服务器上运行的常规 Web 应用程序(未嵌入到我的 android 应用程序中)并且经常更新(因此不适合嵌入到应用程序中),在某些情况下,添加直接查询各种信息的功能会很有用从网页,主要是为了防止 Android 杀死浏览器并在重新进入时强制重新加载网络应用程序,因为我不得不花 5 秒时间跳出(例如)Firefox 手动获取信息。
【问题讨论】:
标签:
javascript
android
native
【解决方案1】:
我认为无论如何您都不能从常规浏览器调用您的 Android API(它们没有将它们作为 DOM 模型的一部分),除非您为每个浏览器构建自己的特定扩展。这将是一项乏味的工作,而且可能不值得,因为这正是嵌入式 WebView 存在的原因(如 Phonegap)。
现在,您总是可以尝试另一种方式,即直接从您的服务器从 WebView 加载您的网页。默认情况下,webviews 从设备的本地存储加载它们的内容,然而,使用 XHR 你可以调用你的传统网页并在 webview 中显示它们。
这可以使用可以嵌入服务器中的一段内容的 div 或 iframe 来从浏览器完全加载整个页面来实现。第二种方法将更加透明,因为您可以完全重用当前网页,但是由于跨源问题安全约束,它会阻止您与网页通信包装器。我建议第一种方法,尽管您可能必须重构您的服务器网页以使它们更好地与您的应用程序集成。
这将像这样工作(为简单起见,我使用 JQuery 的示例,但您可以直接使用 XHR 来完成):
-
您在 webview(phonegap 或您正在使用的任何东西)中创建一个微小的 index.html,并定义一个充当包装器来调用您的服务器:
<html>
<head>
<!-- Load all your css and javascript stuff here -->
</head>
<body>
<div id="wrapperdiv"></div>
</body>
</html>
-
包含一个 javascript 以从您的服务器动态加载内容:
$(function() {
$.ajax({
url: 'http://www.michaels-server.com/your-web-endpoint',
type: 'GET',
crossDomain: true,
success: function(data, textStatus, xhr) {
$('#wrapperdiv').html(data);
}
error: function() { alert("Cannot contact server."); }
});
});
-
配置您的嵌入式 web 视图以允许跨源请求。在 phonegap 中,您可以执行以下操作:
您的 html 包装器中的 div 现在将从您的服务器动态加载内容。该页面中的任何 javascript 都可以使用嵌入式 webviews DOM 模型调用 Native API,例如 Phonegap 提供的模型。
希望这会有所帮助。