[MUSIC]
Bây giờ chúng ta đã hiểu về OAuth 2 và cách Facebook hỗ trợ OAuth 2, chúng ta
hãy chuyển sang bài tập này, nơi chúng tôi sẽ cấu hình
ứng dụng máy chủ nhanh của chúng tôi để sử dụng Facebook như nhà cung cấp OAuth 2 cho máy chủ của chúng tôi.
Và đồng thời cho ứng dụng khách hàng của chúng tôi.
Trong bài tập này, chúng tôi sẽ dựa vào hộ chiếu mà
chúng tôi đã cấu hình trong ứng dụng nhanh của chúng tôi.
Chúng tôi sẽ cấu hình một chiến lược mới để xác thực với Facebook
bằng cách sử dụng đó hộ chiếu Facebook token module.
Để bắt đầu bài tập này,
hãy truy cập https//developers.facebook.com/apps.
Bây giờ, đây là nơi bạn sẽ đăng ký ứng dụng khách hàng, về cơ bản là
máy chủ của bạn, máy chủ bổ sung, hoạt động như ứng dụng khách hàng cho Facebook.
Và sau đó chúng tôi sẽ đăng ký một ứng dụng khách hàng ở đó.
Và sau đó nhận được giữ của một ID ứng dụng và một bí mật ứng dụng từ Facebook.
Bây giờ rõ ràng nó đi mà không nói rằng bạn cần phải có một tài khoản Facebook
để có thể cấu hình này.
Nếu bạn không có tài khoản Facebook và bạn không muốn thực hiện bài tập này,
thì không có hại gì trong việc không thực hiện bài tập này.
Nhưng tất nhiên để thực hiện bài tập OAuth 2 này,
bạn cần một tài khoản Facebook để cấu hình nhà cung cấp OAuth của bạn trên Facebook.
Vì vậy, đi đến trang web này,
Developers.facebook.com/apps, bạn sẽ nhận thấy rằng bạn sẽ cần phải
đăng nhập để tiếp tục nếu bạn không đăng nhập từ trình duyệt của bạn.
Bây giờ bạn có thể thấy rằng tôi đã cấu hình một vài ứng dụng ở đây và
thử nghiệm chúng ra.
Bây giờ, để tạo một ứng dụng mới, nhấp vào Add New App.
Và sau đó bạn có thể cung cấp tên cho ứng dụng của bạn.
Vì vậy, tôi có thể nói Confusion3, và sau đó chúng tôi có thể cung cấp email liên lạc.
Và sau đó làm theo quy trình để tạo ứng dụng mới của bạn ở đây.
Và một khi ứng dụng được tạo ra, bạn sẽ ngay lập tức nhận thấy rằng
có một ID ứng dụng đã được tạo cho ứng dụng của bạn.
Và sau đó cho ứng dụng đặc biệt này.
Vì vậy, nếu bạn đang đi đến bảng điều khiển, bạn sẽ thấy
hai mẩu thông tin mà bạn thực sự yêu cầu để tiếp tục.
Một là App ID, vì vậy hãy đảm bảo rằng bạn tạo một bản sao của App ID.
Và thứ hai là bí mật ứng dụng.
Vì vậy, bạn có thể gõ vào nút hiển thị ở đây và sau đó bạn sẽ nhận được bí mật ứng dụng.
Bí mật ở đây để bạn có thể thấy hai là không có gì ngoài chuỗi ASCII.
Vì vậy, làm cho một bản sao của điều này bởi vì bạn cần phải cấu hình máy chủ chuyên gia
của bạn và cũng ứng dụng khách hàng của bạn với hai phần thông tin này.
Và một khi bạn nắm được điều đó,
chúng ta có thể tiến hành phần còn lại của bài tập.
Bạn sẽ cần phải đi đến bảng điều khiển của bạn về ứng dụng của bạn.
Và trong cài đặt, như bạn thấy, trong cài đặt cơ bản ở đây
bạn chỉ cần thêm một nền tảng trang web ở đây.
Và sau đó cung cấp URL dưới dạng https//localhost3443.
Và lưu các thay đổi ở đây vào ứng dụng của bạn ở đây.
Sau khi thêm vào trang web ở đây, hãy chuyển đến cài đặt nâng cao.
Và sau đó nhấp vào Có để nói
ứng dụng gốc hoặc máy tính để bàn ở đây và nói có với điều đó và sau đó lưu các thay đổi.
Và trong cài đặt cơ bản trong miền ứng dụng,
hãy nhập https://localhost:3443 và lưu các thay đổi.
Tiếp theo, đi đến hướng dẫn tập thể dục cho bài tập này.
Và bạn sẽ thấy rằng có một tập tin index.html mà
tôi đã cung cấp trong các tài nguyên tập thể dục.
Tải xuống tệp index.html này, và sau đó di chuyển nó vào thư mục công cộng của bạn.
Vì vậy, chúng ta hãy tải về tập tin index.html này.
Tiếp theo, vào thư mục ConfusionServer trong thư mục công cộng,
bạn thấy rằng tôi đã có một tệp index.html.
Tôi sẽ thay thế điều này bằng tệp index.html đã tải xuống
mà tôi vừa thu được.
Tôi đã lưu điều này trên máy tính để bàn của tôi.
Vì vậy, tôi chỉ cần kéo index.html này và
sau đó thay thế các tập tin index.html trong thư mục công cộng của tôi ConfusionServer.
Tiếp theo, đi đến trình soạn thảo, hãy mở tệp index.html.
Và nếu bạn mở nó, bạn sẽ thấy rằng tôi đã cấu hình một số
mã JavaScript ở đây.
Mã JavaScript này tôi có giữ từ Facebook nơi họ
chỉ định làm thế nào bạn có thể cấu hình một ứng dụng Dev bằng cách sử dụng này.
Vì vậy, tôi đã sao chép điều này từ hướng dẫn Facebook.
Đặc biệt bạn sẽ nhận thấy rằng trong tập tin index.html này,
có trường AppID này ở đây.
Bạn sẽ được thay thế trường AppID này với
ID khách hàng mà bạn thu được bằng cách đăng ký ứng dụng của bạn trên Facebook.
Vì vậy, ở đây, tôi đang thay thế Id của khách hàng này
với Id của ứng dụng của tôi mà tôi đã đăng ký trên Facebook ở đây.
Và bạn cần thực hiện cùng một bước với ứng dụng
mà bạn đăng ký trên Facebook, với ID ứng dụng mà bạn nhận được từ Facebook.
Và sau đó lưu các thay đổi vào index.html.
Trang index.html này mà tôi có ở đây sẽ tạo ra
một nút đăng nhập trên trang index.html, mà khi nhấp vào sẽ
giúp chúng tôi đăng nhập vào Facebook và sau đó có được một mã thông báo truy cập từ Facebook.
Tiếp theo, đi đến thư mục ConfusionServer,
chúng tôi sẽ cài đặt mô-đun nút token Facebook hộ chiếu.
Vì vậy, tại dấu nhắc loại npm cài đặt
Passport-facebook-token và
cài đặt mô-đun nút này.
Và như bạn có thể thấy tôi đang sử dụng phiên bản 3.3.0 trong khóa học này.
Quay trở lại trình soạn thảo, mở config.js.
Và trong config.js tôi sẽ thêm vào
một tài sản được gọi là 'facebook' vào tập tin config.js của tôi.
Và bên trong đây, tôi sẽ
cấu hình ClientID của tôi và
ClientSecret.
Bây giờ, ClientID sẽ chính xác những gì bạn có được từ Facebook.
Ở đây, và bí mật của khách hàng như bạn đã thấy khi bạn đăng ký ứng dụng của bạn.
Bạn nhận được một chuỗi thứ hai ở đó để sao chép chuỗi đó và
sau đó dán nó vào ClientSecret ở đây.
Bây giờ hãy chắc chắn rằng điều này được dán dưới dạng một chuỗi ở đây.
Tương tự như vậy, dán trong ClientSecret vào tệp config.js của tôi.
Vì vậy, cấu hình này ở đây sẽ giúp tôi sử dụng hai nơi tôi cần trong mã của tôi.
Tiếp theo, như chúng tôi nhận ra, bất cứ khi nào người dùng
đăng nhập và sau đó có được mã thông báo truy cập và chuyển nó vào máy chủ express của chúng tôi.
Các máy chủ nhanh sẽ sử dụng mã thông báo truy cập đó và đi và
lấy các thông tin tập tin từ máy chủ Facebook 0 ought.
Và sau đó, một khi nó đạt được thông tin hồ sơ, sau đó máy chủ nhanh của chúng tôi sẽ
tạo một tài khoản người dùng mới vào ứng dụng của chúng tôi.
Và sử dụng ID Facebook làm chỉ mục vào tài khoản sử dụng này.
Vì vậy, để thích ứng với điều này,
chúng tôi sẽ đi vào các tập tin user.js nơi chúng tôi đã xác định mô hình của chúng tôi.
Vì vậy, ngoài tên đầu tiên và họ,
tôi cũng sẽ thêm vào một lĩnh vực ở đây được gọi là FaceBookID,
đó là loại String ở đây.
FaceBookID sẽ lưu trữ FaceBookID
của người dùng đã thông qua trong mã thông báo truy cập.
Trong bước tiếp theo, tôi sẽ chỉ cho bạn cách cấu hình này.
Sau đó, chúng tôi cấu hình chiến lược Facebook của chúng tôi bằng cách sử dụng thẻ Facebook hộ chiếu..
Khi một người dùng vượt qua mã thông báo truy cập,
sau đó bạn sẽ được lấy hồ sơ và sau đó thiết lập một tài khoản cho
người dùng đó trong máy chủ địa phương của chúng tôi ở đây, trong máy chủ nhanh của chúng tôi ở đây.
Chúng tôi sẽ khởi tạo tên và họ và FaceBookID.
Nhưng tất nhiên tài khoản cụ thể này sẽ không có mật khẩu hoặc
đúng hơn là băm được cài đặt liên quan đến điều này.
Bởi vì, nếu một người dùng làm cho đăng nhập bằng tài khoản này sau đó họ sẽ phải sử dụng
phần đăng nhập Facebook của họ để đăng nhập vào ứng dụng của chúng tôi.
Tiếp theo chúng ta sẽ đi để xác thực tập tin dark.js.
Vì vậy, nơi chúng tôi đã thiết lập tất cả các
chiến lược chứng thực hộ chiếu khác nhau của chúng tôi.
Vì vậy, ở đây ngoài chiến lược jwt và chiến
lược địa phương mà tôi đã cấu hình ở đây,
hãy để tôi tạo ra một FacebookTokenStrategy ở đây.
Và sau đó thiết lập yêu cầu mật khẩu-facebook-token.
Và điều này sẽ cho chúng ta một chiến lược mới mà chúng ta có thể
cấu hình trong mô-đun hộ chiếu của chúng tôi ở đây.
Vì vậy, đi xuống vào mã ở đây, ngay
tại đó, ở phần cuối của tập tin này, tôi sẽ tạo ra,
FacebookPassport như
passsport.use ().
Và vì vậy đây là nơi tôi sẽ chỉ định FaceBookTokenStrategy mới ở đây.
Và sau đó chúng tôi sẽ chỉ định các chi tiết của
FaceBookTokenStrategy này, ngay tại thời điểm này ở đây.
Vì vậy, trong FacebookTokenStrategy này, làm thế nào để chúng ta tiếp cận vấn đề này?
Hãy để tôi chỉ quấn quanh từ bọc để bạn có thể thấy mã hoàn chỉnh.
Vì vậy, đối với FaceBookTokenStrategy, chúng tôi sẽ bắt đầu bằng cách nói đầu tiên.
Phần đầu tiên của FaceBookTokenStrategy mất ClientID.
Mà chúng tôi có cấu hình tại Config.facebook.Clientid đây,
và khách hàng, bí mật,
mà chúng tôi cũng đã cấu hình trong, tập tin cấu hình của chúng tôi ở đây.
Vì vậy, chúng tôi sẽ cung cấp điều này như là tham số đầu tiên cho chiến lược này ở đây.
Và sau đó tham số thứ hai, là nơi bất chấp
chức năng gọi lại mà đi vào tại thời điểm này.
Vì vậy, hàm callback ở đây được ba giá trị.
Vì vậy, nó được AccessToken, R
efreshToken, hồ sơ, và
gọi lại gọi là như đã thực hiện ở đây.
Vì vậy, đây là bốn tham số đi vào hàm callback mà chúng ta sẽ
cấu hình tại thời điểm này.
Vì vậy, hãy để tôi thụt lề mã đó trong để nó là một chút rõ ràng hơn để xem.
Và bên trong chức năng gọi lại này mà tôi cấu hình ở đây,
tôi sẽ đầu tiên nói user.Findone.
Vì vậy, chúng tôi sẽ cố gắng để xem nếu người dùng Facebook đặc biệt này
đã đăng nhập trước đó để tài khoản đã
được cấu hình, Với FaceBookID.
Bây giờ chúng ta có được FaceBookID ở đâu?
Chú ý rằng chúng tôi đang nhận được hồ sơ đó cho người dùng,
đến đây, vì vậy bạn có thể thấy rằng hồ sơ này đang đến như một tham số.
Hồ sơ này sẽ mang theo rất nhiều thông tin đến từ Facebook mà chúng tôi
có thể sử dụng trong ứng dụng của chúng tôi.
AccessToken, tất nhiên, được cung cấp cho máy chủ bởi người dùng.
Vì vậy,
nếu người dùng này tồn tại sau đó chúng tôi đã tìm thấy rằng người dùng trước đó đã
đăng nhập vào tài khoản của chúng tôi bằng cách sử dụng cách tiếp cận Facebook.
Vì vậy, trong trường hợp này chúng ta có thể tiến hành nếu không chúng ta sẽ tạo ra một người dùng mới.
Vì vậy, chức năng gọi lại ở đây sẽ có hai tham số,
err và người dùng ở đây.
Và chức năng gọi lại này như chúng ta sẽ thấy,
tốt bên trong đây chúng ta sẽ kiểm tra để xem nếu (err).
Vì vậy, nếu điều này gây ra một lỗi, sau đó tất nhiên
những gì chúng ta cần làm là trả lại xong (err, false).
Vì vậy, điều này thực hiện như bạn có thể thấy là hàm callback đó là đến như
tham số để chức năng này ở đây, vì vậy
chúng tôi sẽ gọi các done với err và false.
Nếu nó không phải là một lỗi sau đó
chúng ta sẽ nói nếu (! err
&& người dùng! == null).
Vì vậy, nếu người dùng không phải là null, vì vậy điều đó có nghĩa là chúng tôi đã tìm thấy một người dùng trong hệ thống
mà đã không được trước đó với FaceBookID cụ thể, Vì vậy, đối với người dùng,
tất cả những gì chúng ta cần làm là trở lại thực hiện (null,) vì
không có lỗi ở đây, và sau đó chúng tôi sẽ trả lại giá trị người dùng cho điều này xuống đây.
Vì vậy, điều đó có nghĩa là nếu người dùng đã đăng nhập trước đó bằng
cách sử dụng cách tiếp cận Facebook, thì người dùng sẽ đã được tạo ra.
Và như vậy, người dùng đó sẽ được tìm thấy và sau đó chúng tôi chỉ cần vượt qua lại người dùng đó.
Nếu không, xem phần nếu không phải là phần thú vị hơn của bài tập này.
Nếu người dùng không tồn tại, thì chúng ta cần tạo một người dùng mới.
Bây giờ để tạo ra người dùng mới, chúng ta sẽ nói người dùng,
= người dùng mới, và khi chúng ta tạo ra một người dùng mới, hãy
nhớ lại rằng chúng ta cần phải vượt qua tên người dùng.
Tên người dùng sẽ được lấy từ hồ sơ, và hồ sơ Facebook
đã trả lại sẽ có một trường được gọi là tên DisplayName.
Và đó là lĩnh vực mà tôi sẽ sử dụng để tạo ra một người dùng mới ở đây.
Vì vậy, chúng tôi sẽ tạo ra một người dùng mới với tên người dùng được thiết lập
bằng DisplayName, và sau khi người dùng được tạo ra,
sau đó chúng tôi sẽ nói user.facebookid, = profile.id
Vì vậy, chúng tôi sẽ lưu ID Facebook của người dùng.
Vì vậy, trở lại trong đối tượng hồ sơ này ở đây, và
sau đó đặt ID Facebook của người dùng vào ID hồ sơ.
Vì vậy, sau đó, nếu cùng một người dùng đăng nhập,
tìm kiếm này sẽ có thể tìm thấy người dùng này trong cơ sở dữ liệu của chúng tôi.
Và sau đó chúng ta sẽ
nói user.firstname
= profile.name.givenName
Vì vậy, hồ sơ có đối tượng tên này trên
đó, có một tên nhất định và một tên gia đình liên quan đến điều này.
Điều này được trả lại từ hồ sơ Facebook của người dùng.
Và cũng là user.lastname chúng tôi sẽ đặt
nó thành profile.name.FamilyName.
Và sau đó, một khi chúng tôi đã thiết lập tất cả những điều này, chúng tôi sẽ nói user.save.
Vì vậy, chúng tôi đang lưu các thay đổi cho người dùng và
sau đó điều này sẽ trở lại err và người dùng.
Vì vậy, nó sẽ trả lại một lỗi nếu người dùng không thể được tạo ra,
nếu không nó sẽ trả lại người dùng được tạo ra ở đây.
Vì vậy, trong trường hợp này chúng ta sẽ nói, nếu (err),
sau đó sẽ trở lại thực hiện (err,
false) bởi vì chúng tôi đã không quản lý để tạo ra người dùng.
khác, người dùng đã được tạo thành công,
vì vậy chúng tôi sẽ trả lại xong (null, user).
Vì vậy, không có vấn đề gì trường hợp là,
nếu người dùng tồn tại sau đó bạn sẽ tìm thấy người dùng đó và trả về giá trị.
Nếu người dùng không tồn tại, bạn sẽ tạo ra một người dùng mới dựa trên
hồ sơ Facebook của người dùng mà chúng tôi thu được.
Và sau đó thêm vào người dùng mới vào trang web máy chủ của chúng tôi, vào cơ sở dữ liệu.
Vì vậy, đây là chiến lược mà chúng tôi cấu hình cho
hộ chiếu của chúng tôi, FacebookTokenStrategy mới.
Vì vậy, điều này sẽ cho phép chúng tôi tìm thấy người dùng.
Vì vậy, bây giờ chúng tôi đã cấu hình ứng dụng của chúng tôi để
tạo ra một người dùng hoặc tìm người dùng dựa trên ID Facebook.
Bước cuối cùng là tất nhiên để giới thiệu
một tuyến đường mới vào tệp users.js.
Vì vậy, trong tập tin users.js bạn sẽ nhớ lại rằng chúng tôi đã có tuyến đường đăng ký
cho phép người dùng đăng ký tài khoản cục bộ với tên người dùng và mật khẩu.
Và sau đó bạn có đăng nhập cho phép người dùng đăng nhập bằng tên người dùng và
mật khẩu.
Nhưng bây giờ, chúng tôi sẽ sử dụng Facebook để đăng nhập vào người dùng.
Vì vậy, trong trường hợp này chúng ta sẽ nói, router.get,
và điểm cuối sẽ là /facebook/token.
Vì vậy, nếu người dùng gửi một yêu cầu get cho người dùng/facebook/token,
sau đó chúng tôi sẽ được xác thực người dùng bằng cách sử dụng
xác thực dựa trên Facebook OAuth 2.
Vì vậy, ở đây, chúng tôi sẽ nói passport.authenticate, và
chúng tôi sẽ được xác thực bằng cách sử dụng chiến lược facebook-token.
Nhớ lại rằng chúng tôi đã cấu hình này trong tập tin authenticate.js của chúng tôi,
vì vậy chúng tôi sẽ cấu hình hộ chiếu xác thực chiến lược facebook-token và
sau đó chức năng gọi lại mà được req, res ở đây.
Vì vậy, hãy để tôi, Chuyển đổi từ bọc ở đây,
vì vậy bạn có thể thấy rằng đây là router.get trên điểm cuối này ở đây.
Và sau đó ở đây, tôi sẽ cấu hình ứng dụng này.
Vì vậy, tại thời điểm này, chúng ta sẽ nói, nếu (req.user), bây giờ nhận thấy rằng khi chúng ta gọi
passport.authenticate với chiến lược facebook-token.
Điều này, nếu nó thành công,
nó sẽ được nạp vào người dùng vào đối tượng yêu cầu.
Vì vậy, bởi thời gian chúng tôi đến thời điểm này ở đây sau khi passport.authenticate
facebook-token trung gian ware được thực hiện,
bạn sẽ có người dùng đã nạp vào đối tượng yêu cầu.
Vì vậy, nếu đây là trường hợp, Sau đó, chúng tôi sẽ nói, chúng tôi sẽ tạo ra một mã thông báo.
Chúng tôi sẽ tạo ra một mã thông báo web JSON ở đây, giống như cách chúng tôi
tạo mã thông báo web JSON khi người dùng đăng nhập vào đây.
Vì vậy, chúng ta sẽ sao chép nó ở đây.
Authenticate.getToken, vì vậy điều này sẽ giúp chúng tôi nhận được mã thông báo web JSON.
Vì vậy, về cơ bản, người dùng đang gửi mã thông báo truy cập đến máy
chủ express, máy chủ express sử dụng AccessToken để đi đến Facebook và
sau đó lấy hồ sơ của người dùng.
Và nếu người dùng không tồn tại, chúng tôi sẽ tạo một người dùng mới với ID Facebook đó.
Và sau đó, sau đó máy chủ express của chúng tôi sẽ tạo ra
một mã thông báo web JSON và sau đó trả lại mã thông báo web JSON cho khách hàng của chúng tôi.
Tất cả các truy cập tiếp theo từ người dùng của chúng tôi sẽ phải bao gồm
mã thông báo web JSON này mà chúng tôi vừa trả lại bằng cách sử dụng cách tiếp cận này.
Vì vậy, tại thời điểm này bạn không còn cần mã thông báo truy cập Facebook nữa.
Bạn có thể loại bỏ mã thông báo truy cập Facebook tại thời điểm này vì mã
thông báo web JSON là mã thông báo duy trì xác thực người dùng hoạt động trong
bất kỳ thời gian nào mà mã thông báo web JSON này hoạt động.
Bây giờ ngoài việc này, tất nhiên chúng ta cũng cần phải làm những bước này ở đây.
Vì vậy, tôi sẽ chỉ sao chép phần đó ở đây.
bởi vì tôi sẽ làm chính xác cùng một điều trong trường hợp này cũng,
vì vậy chúng tôi sẽ dán vào mã đó ở đây.
Vì vậy, chúng tôi sẽ nói StatusCode = 200, loại tiêu đề nội dung, và
sau đó chúng tôi sẽ nói res.json bạn đã đăng nhập thành công, và đó là nó.
Vì vậy, với cách tiếp cận này, như bạn có thể thấy, bây giờ sử dụng một cuộc gọi đến điểm cuối này.
Ứng dụng người dùng, khách hàng trong trường hợp này,
sẽ vượt qua trong mã thông báo truy cập Facebook mà nó vừa thu được từ Facebook.
Và sau đó máy chủ nhanh của chúng tôi sau đó sẽ sử dụng mã thông báo truy cập Facebook để
xác minh người dùng trên Facebook.
Và sau đó nếu người dùng được Facebook thừa nhận là người dùng hợp pháp,
thì máy chủ thể hiện của chúng tôi sẽ trả lại một mã thông báo kết hôn JSON cho khách hàng của chúng tôi.
Và sau đó khách hàng của chúng tôi được xác thực và
sau đó có thể tiến hành thực hiện các hoạt động khác
bằng cách sử dụng mã thông báo wed JSON trong tiêu đề của tất cả các tin nhắn yêu cầu.
Sau đó, giống như chúng tôi đã làm với chiến lược xác thực địa phương, đó là nó.
Vì vậy, chúng tôi đã hoàn thành tất cả các cập nhật cho ứng dụng của chúng tôi, chúng ta hãy lưu các thay đổi.
Đi đến thiết bị đầu cuối của chúng tôi, chúng ta hãy khởi động máy chủ ở đây,
vì vậy chúng tôi sẽ nói npm bắt đầu, và máy chủ đang lên và chạy.
Và tôi nhận thấy rằng tôi đã gõ vào cổng P-A-S-S-S,
và do đó điều này gây ra một lỗi ở đây.
Vì vậy, lưu ý rằng làm thế nào dễ dàng nó là để làm cho lỗi.
Vì vậy, hãy để tôi đi và sửa chữa điều đó và sau đó trở lại và khởi động lại máy chủ của tôi.
Vì vậy, khi bạn gặp phải những lỗi như thế này, đừng hoảng sợ.
Nhìn xung quanh để xem vấn đề ở đâu và rất thường xuyên,
nó sẽ là một vấn đề đơn giản như thế này sẽ gây ra lỗi cho bạn.
Một lần nữa, quay trở lại users.js và
bạn thấy rằng trong các tập tin authenticate.js,
Tôi đã cấu hình này nói cổng P-A-S-S-S.
Vì vậy, trong tập tin authenticate.js, hãy để tôi sửa chữa điều đó để passsport và
sau đó lưu các thay đổi và sau đó khởi động lại máy chủ của tôi.
Bây giờ, khởi động lại máy chủ của tôi, Vì vậy, máy chủ của tôi bây giờ đã lên và chạy.
Tại thời điểm này, hãy truy cập trình duyệt.
Và trong trình duyệt, nhập https://localhost3443.
Nếu bạn tình cờ có trang này được lưu trữ ở đây, bạn có thể muốn xóa bộ nhớ cache.
Hoặc chỉ cần gõ localhost:3343/index.html, và
sau đó bạn sẽ ngay lập tức nhận thấy rằng trong index.html này,
bạn sẽ thấy nút này được gọi là nút Đăng nhập.
Vì vậy, chúng tôi sẽ nhấp vào nút đăng nhập này để đăng nhập vào Facebook.
Hãy đăng nhập và sau đó bạn sẽ đưa ra thông điệp này ở đây.
Nếu bạn đã đăng nhập vào Facebook trước đó,
nó sẽ yêu cầu sự cho phép để tiếp tục với tư cách là người dùng.
Nếu không, sau đó nó sẽ yêu cầu bạn đăng nhập vào Facebook và
sau đó cho phép bạn tiếp tục.
Kể từ khi tôi vừa đăng nhập vào Facebook một chút trước đó, vì vậy
tôi chỉ có thể nhấp vào Tiếp tục.
Bây giờ, mở giao diện điều khiển JavaScript của các nhà phát triển ở dưới đây.
Và trong bảng điều khiển JavaScript, bạn sẽ thấy một loạt các thông điệp được in ở đây.
Và sau đó đặc biệt,
mở đối tượng này mà bạn sẽ thấy trong giao diện điều khiển JavaScript.
Và bên trong đối tượng này, bạn sẽ thấy phản ứng alt này ở đây.
Và trong đó, bạn sẽ thấy một công cụ truy cập hiện diện ở đó.
Bây giờ, đây là một câu trả lời được lấy từ Facebook hoặc
ra để xác thực máy chủ bởi ứng dụng của chúng tôi ở đây.
Và tôi sẽ chỉ đơn giản sao chép điều này,
bởi vì đây là mã thông báo truy cập mà Facebook đã cung cấp cho chúng tôi.
Bây giờ, tôi cần phải cung cấp mã thông báo truy cập này cho máy chủ nhanh của tôi
để nó đi và xác minh hồ sơ của tôi, và sau đó cho phép tôi đăng nhập vào ứng dụng đó.
Vì vậy, tôi đang làm điều này trong một cách siết chặt
ở đây chỉ đơn giản bởi vì tôi muốn cho bạn thấy làm thế nào các mã thông báo truy cập đến ở đây.
Và chúng tôi sao chép mã thông báo truy cập, sau đó tôi sẽ lấy điều này và
sử dụng Postman để gửi mã thông báo truy cập này đến máy chủ Express của tôi.
Bây giờ, khi bạn thiết kế một ứng dụng web như Angular, hoặc
ứng dụng Ionic, hoặc ứng dụng NativeScript, bạn không cần phải thực hiện tất cả các bước này.
Bây giờ, về cơ bản khi mã thông báo truy cập được trả lại cho ứng dụng web của bạn
, ứng dụng Angular, hoặc ứng dụng Ionic, hoặc ứng dụng NativeScript,
bạn sẽ chỉ cần nắm bắt mã thông báo truy cập này trong đó.
Và sau đó bạn sẽ vượt qua mã thông báo truy cập này vào
máy chủ Express bằng cách sử dụng XMLHttpRequest để có được thông tin.
Nhưng kể từ khi tôi muốn minh họa thủ công các bước.
Vì vậy, tôi thiết lập index.html này với một
mã JavaScript đơn giản mà Facebook cung cấp cho tôi.
Vì vậy, tôi sẽ có thể truy xuất mã thông báo ủy quyền này mà chúng tôi thu được từ
Facebook.
Vì vậy, để tôi sao chép mã ủy quyền này.
Bây giờ, chúng tôi sẽ đi đến Postman, và sau đó thử và
xem làm thế nào chúng tôi có thể có được mã thông báo web JSON từ máy chủ Express của chúng tôi.
Bây giờ, đi đến Postman, từ Postman,
cho phép tôi bây giờ làm một yêu cầu GET để
LocalHost: 3443user'sfacebookToken.
Và khi tôi gửi yêu cầu này đến thời điểm đó,
cấu hình khác mà tôi cần phải làm ở đây là,
tôi cần phải vượt qua trong mã thông báo truy cập này mà tôi vừa thu được.
Bây giờ, để vượt qua một mã thông báo truy cập trong tiêu đề,
tôi có thể vượt qua nó như một tiêu đề ủy quyền bằng cách gõ ủy quyền.
Nhưng lưu ý rằng giá trị nên được gõ như Beta với một chữ B trong trường hợp này,
và sau đó dán mã thông báo truy cập mà chúng tôi thu được từ Facebook ở đây.
Lưu ý vốn B ở đây, và
sau đó bạn có thể vượt qua trong này để máy chủ của chúng tôi.
Và sau đó khi trả lời từ máy chủ của chúng tôi,
bạn sẽ thấy rằng bạn đã có được mã thông báo web JSON từ trang web máy chủ của chúng tôi.
Vì vậy, đây là một cách mà bạn có được mã thông báo web JSON bằng cách trao đổi
mã thông báo truy cập của bạn từ Facebook mà bạn vừa thu được với máy chủ Express của bạn.
Và máy chủ Express của bạn lần lượt sẽ đi và
lấy thông tin hồ sơ của bạn từ Facebook, và
sau đó tạo một tài khoản đặc biệt cho bạn, và
sau đó trả lại cho bạn mã thông báo web JSON nếu mọi thứ thành công.
Một cách khác để đi qua thông tin này là trong tiêu đề,
bạn gõ access_token làm khóa.
Và trong giá trị, bạn chỉ cần gõ vào
mã thông báo truy cập như thế này ở đây, và sau đó bạn có thể gửi yêu cầu Và điều tương tự.
Nó sẽ một lần nữa trả lại mã thông báo web JSON cho bạn.
Và sau đó bạn sẽ nắm bắt mã thông báo web JSON, và sau đó tiếp tục với phần còn lại
của các truy cập vào máy chủ express của bạn bằng cách sử dụng mã thông báo web JSON này.
Một cách tiếp cận thứ ba là bao gồm điều này vào
URL của bạn chính nó như là một tham số truy vấn.
Cách tiếp cận thứ ba là nói mã thông báo? access_token= và
sau đó dán mã thông báo web JSON vào tham số truy vấn đó.
Không sử dụng các dấu ngoặc kép ở đây, chỉ là mã thông báo web JSON.
Và sau đó gửi yêu cầu đến máy chủ của bạn.
Và sau đó thậm chí sau đó máy chủ của bạn sẽ trả về mã thông báo web JSON tương ứng.
Vì vậy, bạn thấy ba cách khác nhau mà bạn có thể phân tích cú pháp trong Facebook Access Token của
bạn đến máy chủ của bạn, và sau đó có được mã thông báo web JSON từ máy chủ của bạn.
Và sau đó, phần còn lại của các bước này tiến hành giống như trước đây.
Bây giờ để thuyết phục bạn rằng thực sự một tài khoản mới đã được tạo ra với
hồ sơ Facebook cho người dùng cụ thể này, chúng ta hãy đi đến thiết bị đầu cuối.
Trong thiết bị đầu cuối, trong một cửa sổ thiết bị đầu cuối mới, tôi sẽ bắt đầu gợn mongo ở đây.
Vì vậy, trong gợn mongo, hãy để tôi nói, sử dụng Confect.
Và sau đó tôi sẽ nói, db.users.find () .pretty (),
và sau đó in ra tất cả những người dùng được đăng ký trong hệ thống của tôi.
Bạn nhận thấy rằng ba người dùng mà chúng tôi đã cấu hình trong các bài tập trước đó
là tất cả ở đó.
Thông báo ngoài một người dùng thứ tư vừa được thêm vào.
Và lưu ý rằng đối với người dùng cụ thể này, chúng tôi chưa có băm trong nguồn,
nhưng thay vào đó FaceBookID của người dùng đó được thiết lập và tên
người dùng được thiết lập là giá trị đó, và tên người dùng được thiết lập ở đó.
Và cũng là tên cuối cùng nên đã được thiết lập ở đây nhưng
tôi nghĩ rằng có một lỗi nhỏ trong mã của tôi.
Vì vậy, tôi sẽ đi và kiểm tra phần họ của nó ở đó.
Đang vào authenticate.js.
Để tôi xem tôi có phạm sai lầm ở đây không.
Chúng ta đi đây.
Tôi đã nhập tên F-A-M-I-L-Y.
Vì vậy, bạn thấy đấy, ngay cả tôi cũng không phải là về phạm sai lầm.
Vì vậy, đây nên là FamilyName đây,
user.lastname hồ sơ .name.FamilyName đây.
Vì vậy, hãy để tôi lưu các thay đổi, và bây giờ mã sẽ hoạt động chính xác.
Một lần nữa quay trở lại thiết bị đầu cuối,
bây giờ bạn thấy rằng một người dùng mới đã được tạo ra với hồ sơ Facebook ở đây.
Bây giờ bất kỳ thời gian tiếp theo tôi đã cố gắng để xác thực bản thân mình bằng cách sử dụng Facebook
là quá trình tương tự.
Tôi thu được mã thông báo truy cập từ Facebook và
sau đó phân tích cú pháp trong mã thông báo truy cập đến máy chủ express của tôi.
Máy chủ nhanh của tôi sau đó sẽ truy cập Facebook, lấy hồ sơ và
sau đó kiểm tra xem người dùng đã tồn tại chưa.
Và trong lần đăng nhập tiếp theo mà tôi sử dụng Facebook,
tôi sẽ thấy rằng người dùng cụ thể này đã tồn tại trong hệ thống.
Vì vậy, nó sẽ chỉ đơn giản là tiến hành về phía trước và người dùng sẽ được xác thực và
sau đó máy chủ bổ sung sẽ phát hành một mã thông báo web JSON cho
khách hàng của họ và chúng tôi có thể tiến hành chuyển tiếp từ thời điểm đó trở đi giống như trước đây.
Vì vậy, bạn thấy, thiết lập xác thực dựa trên OAuth 2 bằng cách sử dụng một
nhà cung cấp dịch vụ OAuth 2 như Facebook không phải là khó khăn với điều kiện chúng tôi nhận được giữ
của hộ chiếu thích hợp Facebook xác thực mô-đun dựa trên chiến lược.
Giống như hộ chiếu Facebook token mà đã chăm sóc phần lớn
công việc thay mặt chúng tôi và sau đó cho phép chúng tôi thiết lập máy chủ thể hiện của chúng tôi
để xử lý xác thực của bên thứ ba dựa trên OAuth 2 từ Facebook.
Với điều này, chúng tôi hoàn thành bài tập này.
Trong bài tập này, chúng tôi đã học được cách thực hiện tất cả các xác thực OAuth 2
bằng cách sử dụng Facebook như xác thực OAuth 2 được cung cấp.
Đây là thời điểm tốt để bạn lưu các thay đổi mà bạn đã thực hiện cho
Git Repository của bạn với thư hộ chiếu Facebook.
[ NHẠC]