Dart登录/注销示例

bas*_*eps 8 authentication dart dart-html

我正在尝试使用Dart找到一个简单的用户身份验证示例.到目前为止,我发现的最接近的是https://github.com/dart-lang/bleeding_edge/blob/master/dart/tests/standalone/io/http_auth_test.dart.任何人都可以指导或提供使用Dart的服务器端身份验证的工作示例.提前致谢.

Kai*_*ren 14

身份验证是一个很大的主题,你没有详细说明你想要实现的目标,但是让我指导你为你的Dart应用程序构建一个Facebook身份验证,因为我认为这是最简单的开始.为什么?因为我们不需要讨论您可能正在使用的每个可能的数据库,或者您如何设置数据库结构,模型等以及如何处理安全性(生成令牌等).

有了这些知识,您就可以实施其他服务身份验证(Google +,Twitter),如果您愿意,最终可以实现自己的身份验证.

因此,首先,通过按" 创建新应用程序"在Facebook应用程序页面注册应用程序.你应该得到这个页面:

在此输入图像描述

(确保填写应用程序域和站点URL)

然后在某处(例如config.dart)指定一些配置文件,您将在任何需要的地方导入:

var config = {
  'authentication': {
    'facebook': {
      'appId': '...',
      'appSecret': '...',
      'url': 'http://test.com/login/facebook'
    }
  },
};
Run Code Online (Sandbox Code Playgroud)

然后你需要在某处创建一个链接.如果您使用的是Web UI,则Dart脚本可以先导入配置并创建登录URL:

import 'config.dart';

main() {
  var fbConfig = config['authentication']['facebook'];
  var appId = fbConfig['appId'];
  var url = fbConfig['url'];

  var loginLinkUrl = 'https://www.facebook.com/dialog/oauth/?client_id=$appId&redirect_uri=$url&state=TEST_TOKEN&scope=email';
}
Run Code Online (Sandbox Code Playgroud)

现在在HTML上指定链接:

<a href="{{ loginLinkUrl }}">Login with Facebook</a>
Run Code Online (Sandbox Code Playgroud)

此时,或许可以阅读Facebook开发人员指南:https://developers.facebook.com/docs/reference/dialogs/oauth/

Facebook登录对话框会将用户抛给我们在config(/login/facebook)中指定的URL ,然后我们的应用程序需要响应它.我让你按照你想要的方式处理路由,但本质上是服务器收到/login/facebook请求时,它首先编码一些属性:

var code = uri.encodeUriComponent(request.queryParameters['code']);
var appId = uri.encodeUriComponent(config['authentication']['facebook']['appId']);
var appSecret = uri.encodeUriComponent(config['authentication']['facebook']['appSecret']);
var url = uri.encodeUriComponent(config['authentication']['facebook']['url']);
Run Code Online (Sandbox Code Playgroud)

你需要import 'dart:uri' as uri先.

在此之后,一些代码向Facebook发出API请求:

http.read('https://graph.facebook.com/oauth/access_token?client_id=$appId&redirect_uri=$url&client_secret=$appSecret&code=$code').then((contents) {
  // "contents" looks like: access_token=USER_ACCESS_TOKEN&expires=NUMBER_OF_SECONDS_UNTIL_TOKEN_EXPIRES
  var parameters = QueryString.parse('?$contents');
  var accessToken = parameters['access_token'];

  // Try to gather user info.
  http.read('https://graph.facebook.com/me?access_token=$accessToken').then((contents) {
    var user = JSON.parse(contents);

    print(user); // Logged in as this user.
  });
});
Run Code Online (Sandbox Code Playgroud)

我在这里使用HTTP包和QueryString包.

API请求后,您可以获得用户信息.现在,您可以执行将经过身份验证的用户存储在会话中的操作.您可以使用例如HttpRequest.session此目的.要注销,只需从会话中删除数据.

这大致是您需要执行的步骤才能使Facebook身份验证工作.您可以期待许多其他网站的类似工作流程.您可能还需要/使用该OAuth2包.

总结一下:

  • 使用正确的URL创建Facebook开发人员个人资料和应用.
  • 在某些配置中记下应用程序ID等.
  • 创建正确的登录链接.
  • 将服务器端代码写入Facebook登录引发用户的位置.
  • 在服务器中编写一些API调用以检索经过身份验证的用户.

玩得开心!

  • Kai,你能用readme.md制作样本并在github上发帖吗?这将是一个很好的推出样本. (5认同)