php - Codeigniter Twitter 风格流和 Ajax

Question

我一直在网上寻找以下问题的解决方案，希望有人能给我指出正确的方向。

我有一个内置于 Codeigniter 中的 Web 应用程序，主视图加载到来自模型的帖子流中。目前用户必须刷新页面才能获取最新内容，这并不理想，我想要实现的是流 div 定期更新并加载新内容。

我对 CI 和 Ajax 都很陌生，我想知道是否有人可以帮助解决问题。

一些代码...

型号

    function stream($uid, $updated, $limit) {
        $this->db->cache_on();
        $now = microtime(true);
        //$sql = "SELECT STATEMENT HERE";
        $query = $this->db->query($sql, array($uid, $uid, $updated, $limit));

        return $query->result();
    }

Controller

   function index() {
        if($this->session->userdata('logged_in')) {

            $session_data = $this->session->userdata('logged_in');
            $data['username'] = $session_data['username'];
            $data['first_name'] = $session_data['first_name'];
            $data['last_name'] = $session_data['last_name'];
            $data['avatar'] = $session_data['avatar'];
            $data['cover'] = $session_data['cover'];

            //Stream Data
            $updated = microtime(true);
            $limit = 100;
            $data['user_id'] = $session_data['id'];

            $this->load->library('pagination');

            $config['base_url'] = BASE_URL;
            $config['total_rows'] = $limit;
            $config['per_page'] = 10;
            $config['num_links'] = 20;

            $this->pagination->initialize($config);

            //$this->load->model('post');
            $data['results'] = $this->post->stream($data['user_id'], $updated, $limit);
            $data['notifications'] = $this->user->notifications($data['user_id']);
            $data['userStats'] = $this->user->getUserStats($data['user_id']);

            $this->load->view('home_view', $data);
            //$this->output->cache(1);
            //$this->output->enable_profiler(FALSE);
        } else {
            //If no session, redirect to login page
            redirect('/', 'refresh');
        }
    }

该 View 很复杂，但本质上它对 $results 数组使用 foreach 循环，然后将键放入 Bootstrap div 例如

<div class="row">
  <div class="col-sm-12">
    <div class="panel panel-default">
      <div class="panel-heading">
    <img src="<?php echo $user_avatar;?>" class="postAvatar">
    <h4><?php echo $user_full_name;?><br><small><i class="fa fa-map-marker"></i> <?php echo $relDate.' from '.$post_location ?></small></h4>
      </div>
      <div class="panel-body bodyText">
    <div class="postBody">
          <?php echo $formatted;?>
    </div>
      </div>
     </div>
   </div>
</div>

Answer 1

我强烈建议您查看WebSocket technique HTML5 中引入。它正是为诸如新贴纸之类的东西而开发的。

还有一个用于跨浏览器支持的 websocket 库，名为 socket-io .

也许您也对 this 感兴趣不错的 jquery 插件。

HTML5 FTW!