Thực tiễn tốt nhất khi sử dụng ổ cắm web?

Question

Tôi có một ứng dụng web được viết bằng Laravel 4. Ứng dụng này sử dụng Ratchet và cụ thể hơn, nó sử dụng gói Latchet. Là một sidenote Tôi đang sử dụng các kỹ thuật sau:

• AutoBahn JS
• ZeroMQ
• Ratchet

Bây giờ tôi nhận được kịch bản sau đây:

• Tôi có một slideshow mà nên nhận cập nhật thông qua websocket.
• Toàn bộ ứng dụng được thiết lập và tôi có thể xuất bản các thay đổi mã mới từ PHP cho các máy khách websocket của tôi thông qua ZeroMq.

• Trong routes.php tôi, tôi có đoạn mã sau, vì vậy mà một chủ đề được đăng ký một cách chính xác:

  //routes.php 
  // Setup a connection and register a topic where clients can connect to. 
  Latchet::connection('Connection'); 
  Latchet::topic('PhotoStream/{client}', 'PhotoStreamController'); 
  

• Sau đó, tôi bắt đầu máy chủ ratchet.

sudo php artisan latchet:listen

Khi một bức ảnh được tải lên, tôi sau đó có thể chạy các đoạn mã sau để đẩy bản cập nhật cho khách hàng được nghe chủ đề của tôi (PhotoStream/client1 trong trường hợp này):

// Create the object, save it to db and then publish it to my websockets 
$photo = new Photo; 
$photo->location = 'path/to/file'; 
$photo->save(); 
// Publish it through my websocket clients. (push from server). 
Latchet::publish('PhotoStream/client1', array('msg' => $photo->toArray())); 

Mã này tất cả đều hoạt động, nhưng trong trường hợp cập nhật. Câu hỏi của tôi là như sau:

Tôi nên xử lý việc khởi tạo ứng dụng khách như thế nào?

1. Tôi có nên hiển thị trang bằng PHP cũ đơn giản và sau đó khởi chạy ứng dụng websocket của mình sau đó nhận thêm thông tin cập nhật (nếu có) ?.
2. Hoặc tôi có nên, khi tôi đăng ký ứng dụng khách web mới, hãy cung cấp thêm thông số với yêu cầu để máy chủ gửi cho tôi dữ liệu hoàn chỉnh thông qua websockets?

Tùy chọn thứ hai trong số hai tùy chọn có vẻ là lựa chọn tốt nhất cho tôi nhưng tôi thực sự không biết cách thực hiện điều này theo cách tốt.

Answer 1

Về phía javascript (để lấy danh sách ban đầu):

//session.subscribe(....) 

session.call('route/to/controller', arg1, arg2).then(function(res) { 
    console.log(res) //initial collection of photos 
}); 

Về phía php (để lấy danh sách ban đầu):

public function call($connection, $id, $topic, $params) { 
    //the id is needed to be able to trace your async calls back to the right promise 
    $connection->callResult($id, $this->getInitialPhotosFilteredByParams($params)); 
}); 

Vì bạn đã nhận được thành công bản cập nhật thông qua đăng ký, đây là tất cả những gì bạn cần. Xem ra cho xss mặc dù, params có thể không được lọc.

Answer 2

Nếu hiểu câu hỏi của bạn đúng cách, bạn sẽ tự hỏi nếu gửi hình ảnh qua websocket là một ý tưởng hay nếu những hình ảnh đó cũng có thể được tải sẵn dưới dạng PHP.

Tôi khuyên bạn nên sử dụng PHP để tải trước hình ảnh mà không sử dụng websocket và sẽ bắt đầu sử dụng ổ cắm khi hình ảnh mới đang được thêm vào.

Bằng cách này, người dùng sẽ thấy hình ảnh từ thời điểm trang được tải và họ sẽ không phải chờ kết nối websocket được thiết lập.

Nếu bạn thích tải trên ổ cắm, tôi vẫn đề nghị bạn tải một vài hình ảnh đầu tiên từ thanh trượt, có thể thấy ngay lập tức, từ PHP. Nếu không, người dùng sẽ phải chờ lâu hơn (lưu ý rằng nhiều, nhưng đáng chú ý lâu hơn vẫn còn).