2013-03-19 25 views
7

Tôi đang cố gắng tìm một ví dụ đơn giản về xác thực người dùng với Dart. Cho đến nay gần nhất tôi đã tìm thấy là https://github.com/dart-lang/bleeding_edge/blob/master/dart/tests/standalone/io/http_auth_test.dart. Bất cứ ai có thể trực tiếp hoặc cung cấp cho tôi một ví dụ làm việc về xác thực phía máy chủ bằng cách sử dụng Dart. Cảm ơn trước.Ví dụ đăng nhập/đăng xuất phi tiêu

Trả lời

14

Xác thực là một chủ đề rộng lớn và bạn không chỉ định nhiều thứ bạn muốn đạt được, nhưng hãy để tôi hướng dẫn bạn xây dựng xác thực Facebook cho ứng dụng Dart của bạn, vì tôi nghĩ đó là cách đơn giản nhất để bắt đầu. Tại sao? Bởi vì chúng tôi không cần phải nói về mọi cơ sở dữ liệu có thể bạn đang sử dụng hoặc cách bạn thiết lập cấu trúc cơ sở dữ liệu, mô hình, v.v ... và cách bạn xử lý bảo mật (tạo mã thông báo, v.v.).

Với kiến ​​thức này, bạn có thể thực hiện các xác thực dịch vụ khác (Google+, Twitter) và cuối cùng là xác thực của chính bạn nếu bạn muốn.

Vì vậy, trước tiên, hãy đăng ký một ứng dụng trên Facebook apps page bằng cách nhấn Tạo ứng dụng mới. Bạn sẽ nhận được trang này:

enter image description here

(Hãy chắc chắn để điền vào cả hai ứng dụng tên miền và URL của trang web)

Sau đó, xác định một số tập tin cấu hình ở đâu đó (ví dụ config.dart) mà bạn sẽ nhập khẩu ở khắp mọi nơi bạn cần:

var config = { 
    'authentication': { 
    'facebook': { 
     'appId': '...', 
     'appSecret': '...', 
     'url': 'http://test.com/login/facebook' 
    } 
    }, 
}; 

Sau đó, bạn cần phải tạo liên kết ở đâu đó. Nếu bạn đang sử dụng giao diện người dùng Web, kịch bản Dart của bạn đầu tiên có thể nhập khẩu các cấu hình và tạo ra một URL đăng nhập:

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'; 
} 

Bây giờ trên HTML của bạn, bạn chỉ định liên kết:

<a href="{{ loginLinkUrl }}">Login with Facebook</a> 

Tại thời điểm này, có lẽ đọc hướng dẫn dành cho nhà phát triển Facebook: https://developers.facebook.com/docs/reference/dialogs/oauth/

Hộp thoại đăng nhập Facebook sẽ đưa người dùng đến URL mà chúng tôi đã chỉ định trong cấu hình (/login/facebook), sau đó ứng dụng của chúng tôi cần phản hồi. Tôi cho phép bạn xử lý các định tuyến như thế nào bao giờ bạn muốn, nhưng về cơ bản máy chủ khi nó nhận được một yêu cầu /login/facebook, nó đầu tiên mã hóa một số tính chất:

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']); 

Bạn cần phải import 'dart:uri' as uri đầu tiên.

Sau đó, một chút mã mà không yêu cầu API lên Facebook:

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. 
    }); 
}); 

Tôi đang sử dụng gói HTTP đây và QueryString gói.

Sau các yêu cầu API, bạn có sẵn thông tin người dùng. Bây giờ bạn có thể làm những việc như lưu trữ người dùng đã được xác thực trong một phiên. Bạn có thể sử dụng ví dụ: HttpRequest.session cho mục đích này. Để đăng xuất, chỉ cần xóa dữ liệu khỏi phiên.

Đây gần như là quy trình bạn cần thực hiện để xác thực Facebook hoạt động. Bạn có thể mong đợi luồng công việc tương tự cho nhiều trang web khác. Bạn cũng có thể cần/sử dụng gói OAuth2.

Vì vậy, để tóm tắt:

  • Tạo hồ sơ nhà phát triển Facebook và một ứng dụng với các URL thích hợp.
  • Viết xuống id ứng dụng và như vậy trong một số cấu hình.
  • Tạo liên kết đăng nhập thích hợp.
  • Viết mã phía máy chủ cho nơi đăng nhập Facebook ném người dùng.
  • Viết một số cuộc gọi API trong máy chủ để truy xuất người dùng đã được xác thực.

Hãy vui vẻ!

+5

Kai, bạn có thể tạo mẫu và đăng trên github bằng readme.md không? Đây sẽ là một mẫu tuyệt vời để đẩy ra. –

2

Tôi đã viết 3 part Tutorial about the login/authorization with Dart bằng tính năng bảo mật Rikulo.

Đăng nhập với lớp Bảo mật là thẳng về phía trước. Dù sao, ví dụ tiêu chuẩn cần một số thay đổi để phù hợp với yêu cầu cụ thể của bạn, đặc biệt là định tuyến/chuyển hướng sau khi hành động.

Hơn nữa, hướng dẫn bao gồm thông tin đăng nhập người dùng giả, rõ ràng không có tùy chọn cho sản xuất. Vì vậy, bạn cần phải @ Override chức năng tiêu chuẩn để đăng nhập từ Rikulo bằng cách tạo Authenticator của riêng bạn

class _Authenticator extends Authenticator { 
    @override 
    Future login(HttpConnect connect, String username, String password) {...}; 
} 

Sau đó đi trước và nói chuyện với máy chủ của bạn và gửi lại hoặc là một đối tượng người dùng trên đăng nhập thành công hay lỗi về thất bại!

Hy vọng điều này sẽ giúp bạn!

+0

Cam kết cuối cùng trong Rikulo github được thực hiện vào ngày 23 tháng 2 năm 2014. Dự án có bị chết không? – expert