我是这个领域的新手，我正在开发一个HTML5 移动应用程序，它调用一个宁静的网络服务 api 并交换 JSON 对象。
我想对客户端进行一次身份验证，并提供一个密钥/令牌，之后可以使用该密钥/令牌，直到预定义的到期日期。我有 4 个问题：
【问题讨论】：
标签： html cordova jquery-mobile oauth restful-authentication
如何保护服务器端 webservices api？有什么工具吗？ 取决于编写 Web 服务的语言，php 具有用于创建 Web 服务 / nusoap 等的 zend 框架。因此所有语言都提供了有关如何保护 Web 服务的信息。
我可以使用本地存储来存储密钥/令牌吗？ 是的，您可以使用本地存储查看 phonegap documentation
我可以在客户端使用哪些 phonegap 安全工具？ 我认为没有，但您可以搜索一些插件或创建自己的插件。取决于您要实现哪种安全性。
在这种情况下如何使用 OAUTH？ 这是OAuth 的库，这似乎很有帮助。您可以创建一个电话间隙插件来与库交互或使用 javascript oauth library（它也带有示例）。
【讨论】：
OAuth 可能对您的需求来说太过分了，请确认您确实需要使用如此强大（且复杂）的标准。
您可能使用的 PHP 服务器端软件的两个示例：
是的！请注意，您必须使用 OAuth 2.0 隐式授权流程才能在客户端获取令牌。
ChildBrowser 是一个插件，用于为身份验证过程打开单独的浏览器窗口。
我编写了一个可以为您执行 OAuth 2.0 的 JavaScript 库 JSO。其他库也存在。
在混合环境下移动设备上运行的WebApps中使用JSO进行OAuth 2.0授权是JSO的一个重要部署场景。
这里是关于使用 Phonegap for iOS 设置 JSO 以及使用 Google 配置 OAuth 2.0 的详细说明。您也可以将它与 Facebook 或其他 OAuth 提供商一起使用。
创建一个新的应用程序
./create /Users/andreas/Sites/cordovatest no.erlang.test "CordovaJSOTest"
原始的 ChildBrowser 插件可在此处获得。
但是，它不与 Cordova 2.0 兼容。相反，您可以使用应该与 Cordova 2.0 一起使用的 ChildBrowser 的这个分支：
你需要做的是复制这些文件：
通过拖放到 XCode 中的 Plugins 文件夹中，进入您的 WebApp 项目区域。
现在您需要编辑在您的 WebApp 项目区域中找到的 Resources/Cordova.plist 中的文件。
在此文件中，您需要在 ExternalHosts 中添加一个带有“*”的数组条目，在 Plugins 中添加两个条目：
如屏幕截图所示。
（来源：erlang.no）
我建议在继续使用 OAuth 之前测试并验证您是否让 ChildBrowser 正常工作。
在您的 index.html 文件中尝试此操作，并使用模拟器进行验证。
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8" src="ChildBrowser.js"></script>
<script type="text/javascript">
var deviceready = function() {
if(window.plugins.childBrowser == null) {
ChildBrowser.install();
}
window.plugins.childBrowser.showWebPage("http://google.com");
};
document.addEventListener('deviceready', this.deviceready, false);
</script>
下载最新版本的JSO：
那里也有关于 JSO 的文档。
回调 URL 需要指向某个地方，一种方法是将回调 HTML 页面放在某个地方，尽管是您信任的主机，但在哪里并不重要。并在那里放一个漂亮的空白页：
<!doctype html>
<html>
<head>
<title>OAuth Callback endpoint</title>
<meta charset="utf-8" />
</head>
<body>
Processing OAuth response...
</body>
</html>
现在，设置您的应用程序索引页面。这是一个工作示例：
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8" src="ChildBrowser.js"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="jso/jso.js"></script>
<script type="text/javascript">
var deviceready = function() {
var debug = true;
/*
* Setup and install the ChildBrowser plugin to Phongap/Cordova.
*/
if(window.plugins.childBrowser == null) {
ChildBrowser.install();
}
// Use ChildBrowser instead of redirecting the main page.
jso_registerRedirectHandler(window.plugins.childBrowser.showWebPage);
/*
* Register a handler on the childbrowser that detects redirects and
* lets JSO to detect incomming OAuth responses and deal with the content.
*/
window.plugins.childBrowser.onLocationChange = function(url){
url = decodeURIComponent(url);
console.log("Checking location: " + url);
jso_checkfortoken('facebook', url, function() {
console.log("Closing child browser, because a valid response was detected.");
window.plugins.childBrowser.close();
});
};
/*
* Configure the OAuth providers to use.
*/
jso_configure({
"facebook": {
client_id: "myclientid",
redirect_uri: "https://myhost.org/callback.html",
authorization: "https://www.facebook.com/dialog/oauth",
presenttoken: "qs"
}
}, {"debug": debug});
// For debugging purposes you can wipe existing cached tokens...
// jso_wipe();
// jso_dump displays a list of cached tokens using console.log if debugging is enabled.
jso_dump();
// Perform the protected OAuth calls.
$.oajax({
url: "https://graph.facebook.com/me/home",
jso_provider: "facebook",
jso_scopes: ["read_stream"],
jso_allowia: true,
dataType: 'json',
success: function(data) {
console.log("Response (facebook):");
console.log(data);
}
});
};
document.addEventListener('deviceready', this.deviceready, false);
</script>
【讨论】：