CakePHP 中的全页缓存

Full Page Cache in CakePHP

我有一个带有一些搜索条件的搜索页面。从该页面我转到其他页面并单击浏览器后退按钮意味着页面正在刷新。实际上我的页面不应该刷新而不是在刷新页面时应该显示一些结果而不刷新。

请多多指教

一些建议:

  1. 使用session存储搜索参数,当用户返回搜索页面时检查session是否存在。如果存在,则使用该参数再次查找数据或加载缓存的查询结果。

  2. 更好的选择,将表单请求类型从 POST 更改为 GET 方法。因此,当您提交搜索表单时,您的 url 看起来像:

    http://myhost.com/search?q=my+term&param1=zzz&param2=&param3=

使用这个url参数再次查找数据。此选项允许您与其他用户共享搜索条件。

创建搜索值以创建唯一键,例如用 md5。然后使用此密钥将结果存储到您的缓存系统(文件,memcached 等)。 因此,如果用户应该 运行 相同的搜索再次直接从缓存中获取结果而不打扰数据库。 它可能看起来像这样:

$sCacheKey = md5(json_encode($this->data));
$result = Cache::read($sCacheKey, 'short');
if ($result === false) {
    $result = $this->YourModel->find(conditions etc....);
    Cache::write($sCacheKey, $li, 'short');
}

或者您想缓存完整呈现的页面?

根据你的问题,我了解到你需要导航到其他页面而不刷新页面,例如 google。

但它不是使用缓存完成的。有称为 pushState()onpopstate() 的函数可以做到这一点。

如何运作?

通过函数pushState(),我们可以在不刷新页面的情况下改变页面的url。而之前的url会自动添加到历史记录中。所以我们需要在 url.

的基础上实现一个单页来加载使用 ajax 的页面内容

函数onpopstate()将在使用pushState()更改url时触发。

示例:

http://html5.gingerhost.com/

以上页面使用了以上功能。该页面由 4 link 组成(家、西雅图、纽约、伦敦)。当我们点击那些 link 时,将加载一个新的 url 而无需刷新页面。

<title></title>
<ul id="menu" class="clearfix"> 
    <li class="current"><a href="/">Home</a></li>
    <li><a href="/seattle">Seattle</a></li>
    <li><a href="/new-york">New York</a></li>
    <li><a href="/london">London</a></li>
</ul>
<article>
     <h1></h1>
     <div id="image"></div>
     <div id="articletext"></div>
     <div class="clear"></div>  
</article>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>

    <script>
    // THIS IS WHERE THE MAGIC HAPPENS
        $(function() {
            //Capture the click on the links
            $('#menu a').click(function(e) {
                href = $(this).attr("href");
                // Call a function to load the content based on the url
                loadContent(href);
                // HISTORY.PUSHSTATE add the url to the history
                history.pushState('', 'New URL: '+href, href);
                e.preventDefault();
            });

            // THIS EVENT MAKES SURE THAT THE BACK/FORWARD BUTTONS WORK AS WELL
            window.onpopstate = function(event) {
                console.log("pathname: "+location.pathname);
                // Load the content on clicking back or forward using its url
                loadContent(location.pathname);
            };

        });

        function loadContent(url){
            // USES JQUERY TO LOAD THE CONTENT PROVIDED BY content.php
            $.getJSON("content.php", {cid: url, format: 'json'}, function(json) {
                    // output provider by content.php like {"title":"Seattle - Part of a demo for #ProSEO","h1":"Seattle","article #articletext":"<p>Seattle is the northernmost major city in the contiguous United States, and the largest city in the Pacific Northwest and the state of Washington. It is a major seaport situated on a narrow isthmus between Puget Sound (an arm of the Pacific Ocean) and Lake Washington, about 114 miles (183 km) south of the Canada - United States border, and it is named after Chief Sealth \"Seattle\", of the Duwamish and Suquamish native tribes. Seattle is the center of the Seattle-Tacoma-Bellevue metropolitan statistical area--the 15th largest metropolitan area in the United States, and the largest in the northwestern United States.<\/p><p>Seattle is the county seat of King County and is the major economic, cultural and educational center in the region. The 2010 census found that Seattle is home to 608,660 residents within a metropolitan area of some 3.4 million inhabitants. The Port of Seattle, which also operates Seattle-Tacoma International Airport, is a major gateway for trade with Asia and cruises to Alaska, and is the 8th largest port in the United States in terms of container capacity.<\/p>","#image":"<img class=\"thumbnail\" alt=\"\" src=\"seattle.jpg\">"}
                    // THIS LOOP PUTS ALL THE CONTENT INTO THE RIGHT PLACES(values will be set)
                    $.each(json, function(key, value){
                        $(key).html(value);
                    });
                });
        }
    </script>

如上所述,您可以呈现内容并提供 json 响应并将其传递给 jquery,您可以实现这一点。