Hi, I am

Ngô Tôn

I am a programmer.

Home / Programming / Web Development / HTML / Thống kê tương tác thực trong Live Stream Facebook

Thống kê tương tác thực trong Live Stream Facebook

Chào các bạn, lâu rồi Ngô Tôn không ra bài viết mới thì hôm nay mình xin chia sẻ một bài mà cũng đang được mọi người quan tâm trong thời gian gần đây.
Từ khi Facebook ra mắt Live stream nó đã mang lại rất nhiều ứng dụng thiết thực cho mọi người đặc biệt với Social Marketing. Gần đây mọi người cũng đang thắc mắc làm thế nào để hiện thị số lượt like hay bày tỏ cảm xúc trực tiếp trên video live stream của mình. Sau đây mình xin hướng dẫn các bạn thực hiện, trong bài viết này mình sẽ lấy ví dụ cho 1 fanpage.

  1. Chuẩn bị
    Đầu tiên bạn cần tạo 1 ứng dụng của facebook để lấy access token:
    – Các bạn vào https://developers.facebook.com/ để tạo ứng dụng.
    – Tiếp theo, các bạn vào https://developers.facebook.com/tools/explorer/ sau đó chọn vào ứng dụng vừa tạo rồi copy đoạn mã access token (để dành cho bước sau).

    Bây giờ các bạn sẽ tiến hành cài đặt phần mềm live stream trên desktop, ở đây mình dùng XSplit Broadcaster:
    – Bạn vào trang chủ https://www.xsplit.com đăng ký 1 account rồi download về tiến hành cài đặt khá đơn giản.

    Bước chuẩn bị cuối cùng, các bạn download source code này về giản nén ra để sử dụng: http://www.mediafire.com/file/ldtgb62bbdp6bfb/live.rar

  2. Cấu hình
    Đầu tiên, các bạn mở XSplit lên sau đó đang nhập vào rồi tạo 1 màn hình để live stream:
    – Các bạn vào mục Sources->Screen capture.., sau đó kéo vùng quay lại trên màn hình. (ở đây mình sẽ mở file index.html ở source trên vừa down về- mình quên chưa giới thiệu trong file các bạn down về có gì, nó chỉ có 3 phần là file index.html và 2 folder imagejs cụ thể trong đó có gì thì chúng ta tính sau).
    live-stream-1
    Các bạn thấy khung màu đỏ chính là vùng mình sẽ quay video live stream lên facebook.
    Tiếp đến các bạn vào mục Outputs->Set up a new output->Custom RTMP
    Các bạn thấy có 2 mục: RTMP URLStream Name , 2 thông tin này ta sẽ lấy từ facebook
    live-stream-2
    Các bạn quay trở lại trang fanpage của các bạn rồi tiến hành tạo 1 video live stream trong mục Công cụ đăng:
    live-stream-3
    Sau đó bạn lấy 2 thông tin URL máy chủKhóa luồng paste vào trong XSplit đặt tên cho output này là Facebook rồi Ok bạn cho chạy live stream khi đó bạn sẽ xem được preview trên facebook.
    Sau khi đăng video lên bạn tiến hành lấy URL của video bằng cách nhấp phải vào chọn Show URL rồi copy chuỗi số cuối cùng ví dụ: https://www.facebook.com/ngoton.it.fanpage/videos/1102250076558543/ (ta sẽ dùng sau).
  3. Tùy chỉnh
    Trong source bạn down về có 3 mục:
    image: chứa hình ảnh nền, emoji (các bạn thay file background.jpg theo hình của các bạn nhớ giữ nguyên tên file)
    js: các bạn không cần quan tâm
    index.html
    Bây giờ ta mở file index.html bằng Notepad tiến hành chỉnh sửa:

    Các bạn thay đổi 2 đoạn này
    var access_token = ‘EAADxM8gqNaQBAB7nb3jeThZA1PfZApfEMxIv1yA06YkX24aSUozdvfz13t6JIJqt6vj16tXQn5Lkybs7095H3ZCzazQa476dZB9NIHhARDDOPbqI4BQgoFA72Ice3E1ZB9xIwuBeiVDgLctBEem7lSoKgRZC3o3X1NZCm6BPmBTPAZDZD‘; //mã tokken của app.
    – Bạn thay vào đoạn mã token của ứng dụng của bạn đã lấy trong phần 1.
    var postID=’657017147803440‘; // ID của bài đăng.
    – Thay số bằng ID của video đã copy ở phần 2.

Xong, bạn load lại file index trên trình duyệt và thử like trên facebook xem lượt tương tác trực tiếp nhé.
live-stream-4

Chúc các bạn thành công 🙂

 

Chào các bạn, lâu rồi Ngô Tôn không ra bài viết mới thì hôm nay mình xin chia sẻ một bài mà cũng đang được mọi người quan tâm trong thời gian gần đây. Từ khi Facebook ra mắt Live stream nó đã mang lại rất nhiều ứng dụng thiết thực cho mọi người đặc biệt với Social Marketing. Gần đây mọi người cũng đang thắc mắc làm thế nào để hiện thị số lượt like hay bày tỏ cảm xúc trực tiếp trên video live stream của mình. Sau đây mình xin hướng dẫn các bạn thực hiện, trong…

User Rating: 4.7 ( 1 votes)

About ngoton

Ngô Tôn is a programmer. He is crazy about new gadgets and up to date with latest technology trends. Use comments to notify any issues you are facing.

Check Also

welcome_back

Welcome Back

Xin chào các bạn, Hôm nay, mình chính thức đánh dấu sự trở lại của …

Leave a Reply

Your email address will not be published. Required fields are marked *