精华内容
下载资源
问答
  • 项目--全页面静态化

    2020-07-26 19:11:45
    全页面静态化 html,css,js静态资源cdn化 js ajax动态请求cdn化 全页面静态化 定义:在服务端完成html,css,甚至js的load渲染成纯html文件后直接以静态资源的方式部署到cdn上 phantomjs 无头浏览器,可以...

    全页面静态化

    html,css,js静态资源cdn化

    js ajax动态请求cdn化

    全页面静态化


    定义:在服务端完成html,css,甚至js的load渲染成纯html文件后直接以静态资源的方式部署到cdn上

    phantomjs


    无头浏览器,可以借助其模拟webkit js的执行


    phantomjs应用

     

    • 修改需要全页面静态化的实现,采用initView和hasInit方式
    <input type="hidden" id="isInit"value="0"/>
    
    function hasInit(){
        var isInit =$("#isInit").val();
        return isInit;
    }
    
    
    function setHasInit(){
    
         $("#isInit").val("1");
    
    }
    

     

    。。。。。之后设置setHashInt();

     

     

    • 防止多次初始化
      • 设置变量,当第二次打开时 不执行ajax。
    • 编写对应轮讯生成内容方式
    • 将全静态化页面生成后推送到cdn
       
    展开全文
  • 定义 ... 不改动任何服务端代码,通过全页面静态化的手段,把已经渲染好的,布满数据...全页面静态化的技术和网页爬虫非常的像,网页爬虫不知道引用的 js 文件或 css 文件,只知道最后爬出来的文件是一个可以在浏览器...

    定义

    • 在服务端完成 html,css,甚至 js 的加载工作,渲染成纯 html 文件后直接以静态资源的方式部署到 CDN 上;
    • 不改动任何服务端代码,通过全页面静态化的手段,把已经渲染好的,布满数据的 html 页面,直接以 html 文件的形式部署到 CDN 上;
    • 全页面静态化的技术和网页爬虫非常的像,网页爬虫不知道引用的 js 文件或 css 文件,只知道最后爬出来的文件是一个可以在浏览器中渲染的文件;

    phantomjs

    • phantomjs 是一个无头浏览器,可以借助其模拟 webkit js 的执行;
    • 有头浏览器就是一般说的浏览器,当在浏览器中访问 getitem.html 的时候,浏览器会加载 html,css,js,并执行 jQuery(document).ready(function(){...}) 方法,发送 ajax 请求,获取完数据,然后 reload dom;
    • 无头浏览器,其实不是个浏览器,但是可以模拟浏览器的一些功能,借助其模拟 webkit 的包完成 js 的执行;

    phontomjs 实战

    • 执行这个文件,bin/phantomjs js/spiderbaidu.js
    • 2000 ms 之后的定时任务是等 jQuery(document).ready(function(){...}) 方法执行完成,把渲染好的页面以图片的格式输出;
    var page = require('webpage').create();
    page.open('http://www.baidu.com', function() {
        setTimeout(function() {
            page.render('baidu.png');
            phantom.exit();
        }, 2000)
    });
    
    展开全文
  • php 静态页面
     public function index()
        {
            $path=ROOT_PATH . 'public/html/index.html';
            if(file_exists($path)){
                echo "我是静态的";
                include ($path);
                exit;
            }else{
                $data=Db::table('sun')
                    ->select();
                $this->assign('data',$data);
                $arr=$this->fetch('index');
                file_put_contents($path,$arr);
                echo '来自表';
                echo $arr;
    //            return view('index');
    //
            }
    
        }

    //ob 函数静态化页面

    ob_start();
    echo "Hello World!";
    $content = ob_get_contents();//取得php页面输出的全部内容
    $fp = fopen("./0001.html", "w");
    fwrite($fp, $content);
    fclose($fp);


    展开全文
  • 思路 将 getitem.html 中 jQuery(document).ready(function(){...... 将生成出来的静态 html 文件部署到 CDN 上,完成全页面静态化的操作; 针对商品详情页的全页面静态化实践 编写 phantomjs 脚本 ge...

    思路

    • 将 getitem.html 中 jQuery(document).ready(function(){... }) 方法中的内容,在服务端或爬虫端执行掉,执行完成之后,依赖于爬虫,生成一个 reload dom 完成的静态 html 文件;
    • 将生成出来的静态 html 文件部署到 CDN 上,完成全页面静态化的操作;

    针对商品详情页的全页面静态化实践

    编写 phantomjs 脚本 getitem.js
    var page = require("webpage").create();
    var fs = require("fs");
    page.open("http://localhost/resources/getitem.html?id=1", function(status) {
        console.log("status = " + status);
        setTimeout(function() {
            fs.write("getitemphantom.html", page.content, "w");
            phantom.exit();
        }, 1000);
    });
    
    修改 getitem.html 中的内容
    • 添加隐藏域;
    <input type="hidden" id="isInit" value="0" />
    
    • 添加几个全局函数,其实就是使用 Balking 模式,使得由无头浏览器执行完,并且生成出来的静态 html 页面,由用户再去打开的时候 ,不会再发 ajax 请求给后端;
    function hasInit() {
        var isInit = $("#isInit").val();
        return isInit;
    }
    
    function setHasInit() {
        $("#isInit").val("1");
    }
    
    function initView() {
        var isInit = hasInit();
        if(isInit == "1") {
            return;
        }
    
        /**
         * ajax 请求对应的域是本地文件,请求的服务器的域名是 localhost,能请求,能响应,但是 ajax 的回调函数认定域不同,是不安全的,
         * 因此会报错,并且走不到 ajax 的 success 回调中;
         * 解决方案:在 Response 的 Header 中增加字段 Access-Control-Allow-Origin:*
        */
        $.ajax({
            type:"GET",
            url:"http://"+g_host+"/item/get",
            data:{
                "id":getQueryString("id")
            },
            // 允许跨域的授信请求,和后端 @CrossOrigin(allowCredentials = "true") 呼应,
            // 使 Session 变成跨域可授信(从 Session 中可以取到短信验证码)
            xhrFields:{withCredentials:true},
            success:function(data){
                if(data.status == "success"){
                    g_itemVO = data.data;
                    reloadDom();
                    setInterval(reloadDom, 1000);
                    setHasInit();
                }else{
                    alert("获取商品详情失败,原因为:" + data.data.errMsg);
                }
            },
            error:function(data){
                alert("获取商品详情失败,原因为:" + data.responseText);
            }
        });
    }
    
    • 修改 getitem.js
    var page = require("webpage").create();
    var fs = require("fs");
    page.open("http://localhost/resources/getitem.html?id=1", function(status) {
        console.log("status = " + status);
        var isInit = "0";
        setInterval(function() {
            if(isInit != "1") {
                page.evaluate(function(){
                    initView();
                });
                isInit = page.evaluate(function(){
                    return hasInit();
                });
            } else {
                fs.write("getitemphantom.html", page.content, "w");
                phantom.exit();
            }        
        }, 1000);
    });
    
    • 执行 getitem.js,注意,此时修改过的 getitem.html 必须放到 Nginx 上去,执行成功后,会生成 getitemphantom.html,其中隐藏域的 value 已经设置成了 1;
    • 用户如果用浏览器打开 getitemphantom.html 会发现没有网络请求,这是一个完全静态化的 html 页面,把这个页面放到 CDN 上去,就可以在 CDN 层面完全命中,不会再有哪怕 ajax 的请求打到源站服务器上去了;
    lixinlei@pc:~/application/phantomjs-2.1.0-linux-x86_64$ bin/phantomjs js/getitem.js 
    status = success
    
    展开全文
  • php页面静态化

    2017-01-17 10:05:28
    为什么要页面静态化 一、加快页面打开浏览速度,静态页面无需连接数据库打开速度较动态页面有明显提高; 二、有利于搜索引擎优化SEO,Baidu、Google都会优先收录静态页面,不仅被收录的快还收录的; 三、
  • 一般新闻发布站如何静态化,实其具体的方法很多,可以通过freemarker去实现,也可以通过apache配制文件去实现(apache自带有页面静态生成功能,当你配制后第一次访问该页面时就生成了静态文件,第二次再次访问时就...
  • 页面静态化

    2012-09-03 18:50:14
    如百度音乐,中的歌曲,歌手,专辑,以及榜单静态化页面。 下面两种方法都是通过文件流来实现的,注意转码问题。我在些就不详细解释,只接上源码  //把流输出 private static void getBuffer(String ...
  • PHP网站页面静态化

    2019-09-18 20:17:27
    页面静态化的分类: 1,按照形式:两者的区别在于PHP生成静态页面的处理机制不同。 1)真静态 2)伪静态,就是url 重写 2,按照范围: 1)局部静态话(jquery,ajax) 2)全部静态化 在PHP网站开发中为了...
  • 网站架构(页面静态化_图片服务器分离_负载均衡)方案解析
  • 页面静态化概述一、静态请求CDN1.1 回源缓存设置1.2 有效性判断1.3 浏览器的三种刷新方式1.4 CDN自定义缓存策略二、静态资源部署策略三、全页面静态化 概述 cdn的核心原理并将静态页面部署到cdn上,之后使用了...
  • 为什么要让网页静态化一、加快页面打开浏览速度,静态页面无需连接数据库打开速度较动态页面有明显提高; 二、有利于搜索引擎优化SEO,Baidu、Google都会优先收录静态页面,不仅被收录的快还收录的; 三、减轻...
  • 什么是PHP静态化PHP静态化的简单理解就是使网站生成页面以静态HTML的形式展现在访客面前,PHP静态化分纯静态化和伪静态化,两者的区别在于PHP生成静态页面的处理机制不同。为什么要让网页静态化一、加快页面打开浏览...
  • PHP静态化的简单理解就是使网站生成页面以静态HTML的形式展现在访客面前,PHP静态化分纯静态化和伪静态化,两者的区别在于PHP生成静态页面的处理机制不同。 为什么要让网页静态化 一、加快页面打开浏览速度,静态...
  • 的是些静态的html标签。一百年都不会换一下的。有什么写的,可是刚刚有这样的想法头就告诉我,不可能会让写静态的html标签的、必须做成动态的可以维护的。 这下我放心了、其实写静态的我会累死的。随便一个导航...
  • function staticIndex() ...//这是Smarty自带的生成静态页面的函数 $static_name = ROOT_PATH.'index.html';//这是生成静态页面当前的路径文件 fopen($static_name,'a');//打开这个文件 @f...
  • 总所周知转化率最高的就是店铺导站,现在想菜鸟们推荐一个有后台管理的ASP淘宝皇冠店铺导航程序,淘宝之家最新程序修改版。这个程序可以添加店铺,商品,文章,广告,后台管理方便,后台一键修改站PID。
  • 在PHP网站开发中为了网站推广和SEO等需要,需要对网站进行站或局部静态化处理,PHP生成静态HTML页面有多种方法,比如利用PHP模板、缓存等实现页面静态化,今天就以PHP实例教程形式讨论PHP生成静态页面的方法。...
  • 静态化

    2015-02-19 18:54:00
    站静态话: 1.单个内容页面非常easy。...伪静态保持静态化时候,所以连接都用自己定义Filter方法,格式化为.htm或其它的了。 所以,站真静态 1.首先也要有方法,把连接路径静态话如/produ...
  • 网站架构(页面静态化,图片服务器分离,负载均衡)方案解析 1、HTML静态化其实大家都知道,效率最高、消耗最小的就是纯静态化的html页面,所以我们尽可能使我们的网站上的页面采用静态页面来实现,这个最简单...
  • 网站设计阶段是网站开发过程中非常重要的阶段之一,我们只有...其实大家都知道,效率最高、消耗最小的就是纯静态化的html页面,所以我们尽可能使我们的网站上的页面采用静态页面来实现,这个最简单的方法其实 也是最...
  • 动态页面静态化

    2011-11-01 15:28:41
    的是些静态的html标签。一百年都不会换一下的。有什么写的,可是刚刚有这样的想法头就告诉我,不可能会让写静态的html标签的、必须做成动态的可以维护的。 这下我放心了、其实写静态的我会累死的。随便一个导航...
  • 在PHP网站开发中为了网站推广和SEO等需要,需要对网站进行站或局部静态化处理,PHP生成静态HTML页面有多种方法,比如利用PHP模板、缓存等实现页面静态化,今天就以PHP实例教程形式讨论PHP生成静态页面的方法。...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,493
精华内容 597
关键字:

全页面静态化