Free App Chat with PubNub and AngularJS - Part 1
PubNub AngularJS SDK giúp chúng ta đơn giản việc tích hợp PubNub vào trong app web chỉ bằng những API đơn giản mà PubNub cung cấp. SDK cũng support cho hệ thống lắng nghe sự kiện của AngularJS, giúp cho AngularJS app dễ dàng hơn trong việc lắng nghe sự kiện của PubNub Bài viết này là bài viết ...
PubNub AngularJS SDK giúp chúng ta đơn giản việc tích hợp PubNub vào trong app web chỉ bằng những API đơn giản mà PubNub cung cấp. SDK cũng support cho hệ thống lắng nghe sự kiện của AngularJS, giúp cho AngularJS app dễ dàng hơn trong việc lắng nghe sự kiện của PubNub
Bài viết này là bài viết đầu tiền trong chuỗi các bài viết giúp các bạn tạo ra một chat app bằng AngularJS. Trong bài này, chúng ta sẽ tập trung vào các chức năng: publishing and subcribing.
Installing PubNub AngularJS SDK
Để làm việc với angularjs chắc chắn chúng ta sẽ dùng những công cụ như npm hay bower để quản lý các package. Tuy nhiên chúng ta vẫn có thể sử dụng được các package một cách trực tiếp đó là add chúng vào bằng script tag.
- Sử dụng PubNub CDN:
<script src="https://cdn.pubnub.com/pubnub-3.7.21.js"></script> <script src="https://cdn.pubnub.com/sdk/pubnub-angular/pubnub-angular-3.2.1.js"></script>
- Sử dụng NPM
npm install --save pubnub pubnub-angular
- Sử dụng bower
bower install --save pubnub pubnub-angular
Creating a simple chat room
Chúng ta sẽ tạo ra các user với id khác nhau để có thể chát live với các user khác
Step 1: Initiating PubNub
Thêm vào Angular app đoạn code dưới đây:
angular.module('app', ["pubnub.angular.service"]) .controller('ChatCtrl', function($scope, Pubnub) { $scope.channel = 'messages-channel'; // Generating a random uuid between 1 and 100 using an utility function from the lodash library. $scope.uuid = _.random(100).toString(); Pubnub.init({ publish_key: 'YOUR-PUBNUB-PUBLISH-KEY', subscribe_key: 'YOUR-PUBNUB-SUBSCRIBE-KEY', uuid: $scope.uuid }); });
Chúng ta vừa set up PubNub với app keys mà các bạn có thể lấy được từ đây. Làm theo hướng dẫn bạn sẽ có được app keys để chạy SDK