一、前言
這篇文章主要是記錄一下php生成靜態頁面的大致步驟，關于頁面靜態化，大家想必都聽說過，但是真正用的時候反而不是很多。有些頁面考慮到訪問量比較大，頁面結構又不常改動的，比如新聞公告等，可以考慮做成靜態頁面放在服務器上，這樣第一是能抗住大流量的訪問，第二也是更加安全一些，打開速度上有保證。
二、正文
1、什么是靜態化
就比如我們平時寫項目的時候，大部分的頁面都是會傳參數進去，通過php標簽把這些參數展示出來。因為我們的參數隨時可以變化，所以頁面上的內容也跟著參數變化，這就是動態化的頁面。與之相反，靜態化就是純粹的html，頁面上的內容不需要通過php或者java等編程語言來改變。
關于靜態化的優點，網上也都說的很清楚了，這邊不再一一贅述，總之就是打開速度夠快，能抗住大流量訪問。
2、靜態化寫法
（1）第一種寫法是通過ob_start()緩存來輸出
在php文件中編寫html代碼，然后用bo_get_content獲取到，然后輸出到html文件，類似于：
?php
//打開輸出控制緩存
ob_start();
echo "html>head>title>test頁面/title>/head>body>Hello world/body>/html>";
//獲取緩沖區的內容
$out = ob_get_contents();
//關閉輸出緩存
ob_end_clean();
//打開test.html文件開啟寫入權限
$fp = fopen("test.html", "w");
if (!$fp) {
echo "Fail";die;
} else {
//寫入文件
fwrite($fp, $out);
//關閉文件
fclose($fp);
echo "Success";
}
參考：php輸出控制函數和輸出函數生成靜態頁面
這種寫法個人感覺會稍微亂一點，而且如果頁面復雜的話，寫出來的php+html代碼會有些雜亂，所以博主選用的是第二種方法。
（2）提前寫好模板頁，然后進行替換
先準備好靜態文件，然后把要替換的部分標出來，如{title}，在php程序中用file_get_content獲取html文件的內容，然后進行替換，替換之后保存為文件。
模板頁：
!DOCTYPE html>
html>
head>
meta charset="utf-8">
title>{top_title}/title>
link rel="stylesheet" href=" " rel="external nofollow" >
/head>
body>
div class="news-details-template">
h1>{title}/h1>
div class="author">{author}/div>
div class="date">{show_time}/div>
div class="line">/div>
div>
{content}
/div>
/div>
/body>
/html>
我們先編寫好模板頁面，包括都有哪部分需要替換，基本的樣式等，提前寫好
php替換：
$path = \Yii::getAlias('@xxx').'/views/site/notice-detail.php';
$content = file_get_contents($path); //引入模板
//獲取要替換的值進行字符串的替換
$content = str_replace('{top_title}',$title,$content);
$content = str_replace('{title}',$title,$content);
.......
$dir = $path ."/html/";
if (!file_exists($dir)) {
mkdir($dir);
}
$filename=$dir.'/'.$filename; //這里就不判斷html是否存在了，因為寫入會覆蓋
$result = file_put_contents($filename,$content);//寫入內容到對應靜態文件中
大概就是先通過file_get_contents獲取模板頁的內容，然后通過str_replace進行標簽的替換，替換完成之后，通過file_pu_contents寫入到新文件即可。生成的html，我們可以生成多個html，讓前端根據不同的頁面去訪問不同的html即可。
三、生成預覽
生成html之后，一般來說是需要預覽給工作人員看看的，畢竟人家也不懂技術，不知道到底生成的是啥
1、使用dialog打開窗口
靜態頁：
//這是我們要打開的窗口，先隱藏
div id="dialog-form-record" style="display:none;">
div id="Content_record">
/div>
/div>
JS定義底部按鈕：
var arrButton = {
"Release": {
'text': '按鈕名稱',
'priority': 'secondary',
'class': 'btn btn-success',
'id':'',
'click':點擊事件
},
"Cancel": {
'text': 'Cancel', //取消按鈕
'priority': 'secondary',
"id":'xxx',
'click': function () {
dialogRecord.dialog( "close" );
}
}
};
//定義寬高
dialogRecord = $( "#dialog-form-record" ).dialog({
autoOpen: false,
height: 800,
width: 1400,
modal: true,
buttons:arrButton,
close: function() {
$( "#Content_record" ).html("");
dialogRecord.dialog( "close" );
}
});
JS打開窗口：
//定義標題和窗口大小
$( "#dialog-form-record" ).dialog( "option", "title", "Preview Html" );
$( "#dialog-form-record" ).dialog({
modal: true,
height: 800,
width: 1400
});
2、使用iframe引入剛才生成的靜態文件
（1）js引入iframe
//加個時間戳，防止緩存
for (i in response.)
iframe += "iframe class='news_iframe' id='iframe"+ i +"' src='"+ response.url.url +"/news/html/"+ response.zh[i] + "?timestamp= " + new Date().getTime() + "'>/iframe>";
}
//把iframe寫入到html
$( "#en_content" ).html(iframe);
3、注意：
（1）iframe的src里面不能有空格之類的東西
（2）iframe去除邊框
（3）iframe加載速度慢，所以加個onload事件，當iframe加載完之后再顯示
var iframe = document.getElementById("iframe" + count);
checkFinishedDownload(iframe);
function checkFinishedDownload(ifr) {
if (ifr.attachEvent) {
ifr.attachEvent("onload", function() {
//iframe加載完成后你需要進行的操作
});
} else {
ifr.onload = function() {
//iframe加載完成后你需要進行的操作
};
}
}
最終效果：
以上就是從生成靜態頁面到預覽的整個流程了，博主也是第一次做靜態頁面相關的東西，還是挺有意思的，打卡記錄一下。
希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:- html靜態頁面調用php文件的方法
- PHP生成HTML靜態頁面實例代碼
- 使用PHP實現生成HTML靜態頁面
- 比較詳細PHP生成靜態頁面教程
- php 靜態頁面中顯示動態內容
- php 生成靜態頁面的辦法與實現代碼詳細版
- 談PHP生成靜態頁面分析 模板+緩存+寫文件
- js+php實現靜態頁面實時調用用戶登陸狀態的方法
- PHP偽靜態頁面函數附使用方法
- PHP采集靜態頁面并把頁面css,img,js保存的方法
