页面静态化

微信扫一扫,分享到朋友圈

页面静态化

一、网页静态化介绍

1、概述

就是把一个动态的页面(.php)变成一个静态页面(.html),后续用户直接访问静态页面。

页面静态化技术分为两种:真静态和伪静态。

真静态 :把一个动态的页面,转成一个静态的页面,即.html文件

伪静态: 所谓伪静态是从url地址上看是一个静态页面,但是实际上还是对应一个动态页面

2、几个重要的概念

(1)动态网址:

所谓动态网址,一般来说去查询数据库,比如:
http://www.abc.com/goods.php?…

特点:查询数据库,速度慢;接收参数,安全性要注意(sql注入);不利于seo搜索引擎优化。

(2)静态网址

比如:
http://www.abc.com/index.htm…

特点:不查询数据库,速度快;不接收参数,安全性高;利于seo

(3)伪静态网址:

特点:本身需要查询数据库,执行速度慢;不接收参数,因此安全;利于seo

3、真静态实现方式

真静态:使用ob缓存技术来实现,

伪静态:使用web服务器的rewrite机制(url的重写机制)来实现。

4、OB基本介绍

ob就是output_buffering输出缓存,在请求一个php的过程中,我们实际上经过三个缓存:

程序缓存、

ob缓存、

浏览器缓存

1、程序缓存(默认开启,不能关闭)

该缓存是php固有的,不能关闭,缓存返回到客户端(浏览器端包括 头信息 和响应 主体信息 )的数据。

2、ob缓存(默认开启,可以关闭)

ob缓存(output_buffering)又叫ob缓冲: 缓存响应主体的数据

开启方式:

(2)通过php.ini配置文件来开启。output_buffering = 4096

4096是设置ob缓存的容量,也可以不指定容量开启,使用on

output_buffering=on|off|具体的容量

ob缓存(如果开启)–》程序缓存-》浏览器缓存。

如果开辟了ob缓存, 主体数据 首先存储到ob缓存里面, 头信息要存储到程序缓存 (无论是否开启ob缓存),

当代码执行完毕后,ob缓存里面的数据刷新(移动)到程序缓存,程序缓存再输出到浏览器缓存中,最后输出内容。

5、ob缓存对应的函数

ob_start(); //开启ob 缓存,在当前页面有效

ob_get_contents(); //获取ob缓存里面的数据。

ob_start();
echo '111';
echo '222';
$ob = ob_get_contents();
echo $ob;

ob_clean(); 清空ob缓存里面的数据,没有关闭ob缓存。

ob_start();
echo '111';
echo '222';
$ob = ob_get_contents();
echo $ob;
ob_clean();
echo 'ok';

ob_end_clean(); 清空ob缓存里面的数据,并关闭ob缓存。

ob_start();
echo '111';
echo '222';
$ob = ob_get_contents();
echo $ob;
ob_end_clean();
echo 'ok';
header('content-type:text/html;charset=utf8')

ob_flush(); //把ob缓存里面的数据,刷新(移动)到程序缓存,不关闭ob缓存。

ob_start();//开启ob缓存
echo '222';
ob_flush();//把ob缓存里面的数据移动到程序缓存,并不关闭ob缓存;
echo 'ok';
header('content-type:text/html;charset=utf8');

ob_end_flush(); //把ob缓存里面的数据刷新(移动,推送)到程序缓存,并关闭ob缓存。

ob_gzhandler(); //对数据进行压缩,依赖于浏览器所能接受的压缩格式,形成不同的压缩编码。

ob_start(“ob_gzhandler”); 可以对ob缓存里面的数据进行压缩后返回数据。

常用的是: ob_start()、 ob_get_contents()、 ob_clean()

$content = ob_get_contents();
file_put_contents(‘index.html’,$content);

6、真静态典型案例

要判断有没有生成静态页面,如果有静态页面,则直接读取静态页面里面内容,如果没有则要重新生成静态页面。

扩展:

给生成的静态页面一个缓存周期,比如缓存5分钟,过了5分钟之后,则要重新生成静态页面。

判断是否在缓存周期内:文件的最后修改时间+缓存周期  >   当前的时间戳。
filemtime — 取得文件修改时间,返回的是时间戳。
if(file_exists($filename) && $filemtime($filename)+300>time()){
include $filename;
exit;
}
//接收传递的id
$id = $_GET['id'];
//给生成静态页面命名
$filename = 'news_info_id'.$id.'.html';
if(file_exists($filename)  && filemtime($filename)+300>time()){
include $filename;
exit;
}
//开启ob缓存;
ob_start();
$pdo = new PDO('mysql:host=localhost;dbname=php69','root','root');
$pdo->exec('set names utf8');
$res = $pdo->query("select id,title,description from movie where id=$id");
$info = $res->fetch(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>网页标题</title>
<meta name="keywords" content="关键字列表" />
<meta name="description" content="网页描述" />
<link rel="stylesheet" type="text/css" href="" />
<style type="text/css"></style>
<script type="text/javascript"></script>
</head>
<body>
<?php echo $info['title']?>
<hr>
<?php echo $info['description']?>
</body>
</html>
<?php
//把ob缓存里面的内容给取出来,写入到一个文件里面;
$content = ob_get_contents();
file_put_contents($filename,$content);

7、真静态优缺点

优点: (1)速度快 (2)安全性高 (3)利于seo

缺点:就是占有磁盘空间., 如果过大,对磁盘响应速度有影响。

在什么情况下,建议不要使用真静态

(1)页面的数据更新频繁,最好不要使用真静态(比如股票,基金,等实时报价系统)

(2)会生成海量页面(比如大型论坛 bbs ,csdn)

(3)查询该页面一次后,以后再也不查询该页面.

(4)不愿意被搜索引擎抓取的页面.

(5)访问量小的页面.

二、伪静态

在实际开发项目中,我们的页面不适合使用真静态,但是你不仅希望页面安全性高,同时利于seo,可以考虑使用伪静态技术。

伪静态:把一个动态的地址伪装成一个静态的地址。

比如:

原来的访问地址是: http://www.abc.com/news.php?t…

改成 http://www.abc.com/news-sport…

1、实现方式

利用web服务器的rewrite机制。

rewrite机制:将一个请求URL重写到另一个请求上!

在rewrite机制中,使用正则表达式来完成重写规则。

比如:

index.html 重写成 index.php

abc.php 重写成 123.php

news_sport_id12.html 重写成 news.php?type=sport&id=12

2、如何开启

找apache服务器的配置文件httpd.conf

LoadModule rewrite_module modules/mod_rewrite.so

3、具体配置

三个指令:

RewriteCond 重写条件
RewriteRule 重写规则。

(1)、RewriteEngine on

重写引擎开关,一旦开启,所有的重写条件都生效。

(2)、RewriteCond 重写条件

当达到什么条件时,完成重写。

语法:

RewriteCond 判断依据 条件表达式 [ 条件标志 ]

判断依据 可以使用服务器变量。服务器可以得到一些特定信息

条件表达式 ,可以为如下形式:正则或特殊标识

-f 表示是一个文件,!-f 不是文件

-d 表示是一个目录,!-d 不是目录

正则,正则表达式字符串。

条件标志:

[OR] 条件间的或者关系,当出现多个条件时,默认为并且的关系,条件应该是或者的关系下,可以使用OR来表示!

[NC]条件不区分大小写。条件匹配时不区分大小写

[OR,NC]

(3)、RewriteRule 定义重写规则

定义重写规则,哪个地址应该被重写到哪个目标地址。

语法:

RewriteRule 匹配地址  目标地址 [标识]

匹配的地址 :所请求的地址,可使用正则匹配

目标地址 : 所重写到的地址,可以使用反向引用!$N表示正则匹配到的第N个子模式!

比如:RewriteRule goods-id(d+).html goods.php?id=$1

标志:

[NC] 不区分大小写

[QSA] 查询字符串追加,在目标地址已经具有get参数时,会将真实请求的get参数追后边。

案例:当访问index.html页面时,重写到index.php页面

我们使用分布式文件配置来完成,.htaccess文件

第一步:打开虚拟主机里面的配置,配置支持分布式配置。

第二步:在e:/amp/home目录下面新建一个.htaccess文件(通过编辑器另存为的方式建立.htaccess文件)

第三步:在.htaccess文件里面进行具体的配置。

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule index.html index.php
</IfModule>

第四步:在网站的根目录下面,新建一个 index.php文件,进行测试

4、入门案例

如果访问的文件存在,则访问该文件,若不存在,则执行重写:

比如:我们访问index.html 文件,如果 index.html文件存在,则访问该文件,如果该文件不存在,则重写到请求one.php页面。

# 开启重写引擎
RewriteEngine on
# 定义重写条件  url不是一个文件,则执行重写
RewriteCond %{REQUEST_FILENAME} !-f [NC]
# 定义重写规则
RewriteRule index.html index.php [NC]

5、新闻案例,配置成伪静态

news-info-id(d).html newsinfo.php?id=$1

$1是一个反向引用,就是前面(\d)里面的内容;(\d)是谁,$1就表示谁,比如如下;

news-info-id4.html newsinfo.php?id=4

news-info-id5.html newsinfo.php?id=5

.htaccess里面的配置:

# 开启重写引擎
RewriteEngine on
# 定义重写条件  url不是一个文件,则执行重写
RewriteCond %{REQUEST_FILENAME} !-f [NC]
# 定义重写规则
RewriteRule  news-info-id(\d).html   newsinfo.php?id=$1

效果:

6、使用rewrite机制完成防盗链

什么是防盗链

如何防止被盗链

第一:采用非技术手段,添加水印,添加自己公司的logo

第二:使用rewrite机制来,完成防盗链。

核心思路:

判断请求的来源,在连接图片时,要判断是否本网站的页面来连接,如果是就允许连接,如果不是本网站则就拒绝。

如何判断是自己访问还是其他网站访问图片呢?

通过referer的头信息,该头信息记录了请求的来源。

自己网站的页面访问图片资源:

其他域名网站访问图片资源:

思路:判断referer头信息里面是否有自己的域名,如果有,则是自己访问,就允许访问,如果没有就拒绝访问。

# 开启重写引擎
RewriteEngine on
# 定义重写条件
RewriteCond %{HTTP_REFERER} !www.like520.cn
# 定义重写规则  - 表示重写到 空  [F] 表示禁止访问
RewriteRule \.(jpg|jpeg|gif|bmp)$ - [F]

其他域名网站访问效果如下:

可以给来盗链的网站一个提示:

# 开启重写引擎
RewriteEngine on
# 定义重写条件
RewriteCond %{HTTP_REFERER} !www.like520.cn
# 定义重写规则  - 表示重写到 空  [F] 表示禁止访问
RewriteRule \.(gif|jpg|bmp)$ 110.gif

其他域名网站访问效果如下:

微信扫一扫,分享到朋友圈

页面静态化

three.js 自制骨骼动画(二)

上一篇

天神圣甲降临引燃全场!《战神遗迹》首次亮相ChinaJoy

下一篇

你也可能喜欢

页面静态化

长按储存图像,分享给朋友