PHP：如何加載圖像onscroll與服務器端分頁

-2

我從我的另一個網站獲取超過1000個圖像，我想要在服務器端請求他們，當用戶向下滾動一步一步。我的問題是他們一起加載，我不知道如何在滾動期間部分加載它們。 Lazyload僅解決了我的問題的客戶端。PHP：如何加載圖像onscroll與服務器端分頁

CODE：

$url = 'http://mydomain/page/'; 
$string = ''; 
for($i=0; $i<10; $i++){ 
    $string .= FetchPage($url.$i); 
    } 
$image_regex_src_url = '/<img[^>]*'. 
'src=[\"|\'](.*)[\"|\']/Ui'; 

preg_match_all($image_regex_src_url, $string, $out, PREG_PATTERN_ORDER); 

$images_url_array = $out[1]; 

foreach ($images_url_array as $image) { 
    $elements = explode('/', $image); 
    $name = end($elements); 
    $checkname = explode('.', $name); 
    if(end($checkname) === 'jpg' || end($checkname) === 'png'){ 
     $img = 'images/'.$name; 
     list($width, $height) = getimagesize($image); 
     if($height < 4000 && $height > 300) { 
      if(!file_exists($img)){ 
       file_put_contents($img, file_get_contents($image)); 
      } 
      print_r('<img src="'.$img.'" width="900" />'); 
     } 
    } 
}

@EDIT：

我解決了我的問題，所有的數據抓取到我的服務器，然後在客戶端lazyload.js輸出它。

來源

2016-07-29 sgracki

img.onload = loadNextImage; –

您無法通過客戶端管理服務器端。當用戶進行滾動時，這是一個客戶端事件，而不是服務器功能。所以PHP在這裏沒有任何東西。你必須使用JavaScript。 –

解決方案可以是在數據標記（例如data-img-src）中輸出圖像源，讓每個src爲空，然後在img可見的情況下用數據標記替換它（使用js）。一個好的事情也將是內聯輸出img寬度和高度。這就是大多數（如果不是全部的話）lazyload插件實現它的原因，我認爲這是考慮到性能的最佳解決方案之一，因爲您不需要運行一堆j來先禁用圖像加載。

我個人會爲此找到一個插件並修改php以匹配插件規範。

來源

2016-07-29 11:59:24

PHP：如何加載圖像onscroll與服務器端分頁

回答

相關問題