2012-12-07 5 views
1

Core 5 File Manager 유틸리티가 성공적으로 사용되었지만 일단 디렉토리에 100 개의 이미지가 축적되면 IE 사용자를 위해 속도가 느려지 기 시작했습니다. 나는 게으른 로딩을 해킹하려고 노력하고 있지만 매우 성공적이지 못했다. json으로 요청이 데이터 구조체를 구축하기 위하여 항목 cfdirectory 태그를 사용하여 ColdFusion 함수 광범위한 연구 후에 호출자핵심 5 개의 실험실 파일 관리자는 지연로드를 추가합니다.

<cffunction name="_getDirectoryInfo" returntype="array" access="private"> 
    <cfargument name="path" type="string" required="yes" /> 
    <cfargument name="getsizes" type="boolean" required="yes" /> 
    <cfargument name="filter" type="string" required="no" default="" /> 
    <cfset var dirlist_qry = "" /> 
    <cfset var data_arr = arrayNew(1) /> 
    <cfset var currData_struct = "" /> 
    <cfset var imageData_struct = "" /> 
    <cfset var dirPath = (arguments.path) /> 
    <cfset var webDirPath = _getWebPath(dirPath) /> 
    <cfset var displayWebPath = _getWebPath(path=dirPath, includeUploadRoot=false) /> 

    <cfif not DirectoryExists(dirPath)> 
     <cfdirectory action="create" directory="#dirPath#"> 
     <!--- no longer required, we will auto create the directory 
     <cfset returnError(translate('DIRECTORY_NOT_EXIST', dirPath)) /> 
     ---> 
    </cfif> 

    <cftry> 
     <cfdirectory action="list" directory="#dirPath#" name="dirlist_qry" sort="type,name" filter="#arguments.filter#" /> 
     <cfcatch> 
      <cfset returnError(translate('UNABLE_TO_OPEN_DIRECTORY', arguments.path, cfcatch.message & " - " & cfcatch.detail)) /> 
     </cfcatch> 
    </cftry> 

    <cfloop query="dirlist_qry"><cfif find('.', dirlist_qry.name) neq 1> 
     <cfset currData_struct = structNew() /> 
     <cfset arrayAppend(data_arr, currData_struct) /> 

     <cfset structInsert(currData_struct, "Filename", dirlist_qry.name) /> 
     <cfset structInsert(currData_struct, "Error", "") /> 
     <cfset structInsert(currData_struct, "Code", 0) /> 
     <cfset structInsert(currData_struct, "Properties", structNew()) /> 
      <cfset structInsert(currData_struct.Properties, "Date Created", "") /> 
      <cfset structInsert(currData_struct.Properties, "Date Modified", "#lsdateformat(dateLastModified, 'medium')# #timeformat(dateLastModified, 'HH:mm:ss')#") /> 
      <cfset structInsert(currData_struct.Properties, "Height", "") /> 
      <cfset structInsert(currData_struct.Properties, "Width", "") /> 
     <cfif dirlist_qry.type eq "DIR"> 
      <cfset structInsert(currData_struct, "Path", webDirPath & dirlist_qry.name & "/") /> 
      <cfset structInsert(currData_struct, "VisiblePath", displayWebPath & dirlist_qry.name & "/") /> 
      <cfset structInsert(currData_struct, "File Type", "dir") /> 
      <cfset structInsert(currData_struct, "Preview", request.directoryIcon) /> 
      <cfset structInsert(currData_struct.Properties, "Size", "") /> 
     <cfelse> 
      <cfset structInsert(currData_struct, "Path", webDirPath & dirlist_qry.name) /> 
      <cfset structInsert(currData_struct, "VisiblePath", displayWebPath & dirlist_qry.name) /> 
      <cfset structInsert(currData_struct, "File Type", lCase(listlast(dirlist_qry.name, '.'))) /> 
      <cfset structInsert(currData_struct.Properties, "Size", dirlist_qry.size) /> 
      <cfif _isImage(dirlist_qry.name)> 
       <cfset structInsert(currData_struct, "Preview", webDirPath & dirlist_qry.name) /> 
       <cfif arguments.getsizes> 
        <cfset imageData_struct = _getImageInfo(dirlist_qry.directory & variables.separator & dirlist_qry.name) /> 
        <cfset structInsert(currData_struct.Properties, "Height", imageData_struct.height, true) /> 
        <cfset structInsert(currData_struct.Properties, "Width", imageData_struct.width, true) /> 
       </cfif> 
      <cfelse> 
       <cfset structInsert(currData_struct, "Preview", request.defaultIcon) /> 
      </cfif> 
     </cfif> 
    </cfif></cfloop> 

    <cfreturn data_arr /> 
</cffunction> 

리턴 안타

// Retrieve the data and generate the markup. 
$.getJSON(fileConnector + '?path=' + path + '&mode=getfolder&getsizes=false&showThumbs=' + showThumbs, function(data){  
    var result = ''; 

    if(data){ 
     if(data['Code'] && data['Code'] != 0) 
     { 
      result = "<div style='text-align:center;color:red;'>An error occured:<br \/>" + data['Error'] + "<\/div>"; 
      // $.prompt(data['Error']); 
     } else 
     { 
      var key = ''; 
      if($('#fileinfo').data('view') == 'grid'){ 
       result += '<ul id="contents" class="grid">'; 

       for(key in data){ 
        var props = data[key]['Properties']; 
        if (props) 
        { 
         var scaledWidth = 64; 
         var actualWidth = props['Width']; 
         if(actualWidth > 1 && actualWidth < scaledWidth) scaledWidth = actualWidth; 

         result += '<li class="' + (data[key]["File Type"] == 'dir' ? 'directory':'file') + '">'+ 
         '<div class="clip"><img src="' + data[key]['Preview'] + '" width="' + scaledWidth + '" alt="' + data[key]['VisiblePath'] + '" /></div><p>' + data[key]['Filename'] + '</p>'; 
         if(props['Width'] && props['Width'] != '') result += '<span class="meta dimensions">' + props['Width'] + 'x' + props['Height'] + '</span>'; 
         if(props['Size'] && props['Size'] != '') result += '<span class="meta size">' + props['Size'] + '</span>'; 
         if(props['Date Created'] && props['Date Created'] != '') result += '<span class="meta created">' + props['Date Created'] + '</span>'; 
         if(props['Date Modified'] && props['Date Modified'] != '') result += '<span class="meta modified">' + props['Date Modified'] + '</span>'; 
         result += '</li>'; 
        } 
       } 
       result += '</ul>'; 
       if (key=='') 
       { 
        result = '<div style="margin-top:40px;text-align:center;"><em>No files found</em></div>'; 
       } 
      } else { 
       result += '<table id="contents" class="list">'; 
       result += '<thead><tr><th class="headerSortDown"><span>Name</span></th><th><span>Dimensions</span></th><th><span>Size</span></th><th><span>Modified</span></th></tr></thead>'; 
       result += '<tbody>'; 

       for(key in data){ 
        var path = data[key]['VisiblePath']; 
        var props = data[key]['Properties']; 
        if (props) 
        { 
         result += '<tr class="' + (data[key]["File Type"] == 'dir' ? 'directory':'file') + '">'; 
         result += '<td title="' + path + '">' + data[key]['Filename'] + '</td>'; 

         if(props['Width'] && props['Width'] != ''){ 
          result += ('<td>' + props['Width'] + 'x' + props['Height'] + '</td>'); 
         } else { 
          result += '<td></td>'; 
         } 

         if(props['Size'] && props['Size'] != ''){ 
          result += '<td><abbr title="' + props['Size'] + '">' + formatBytes(props['Size']) + '</abbr></td>'; 
         } else { 
          result += '<td></td>'; 
         } 

         if(props['Date Modified'] && props['Date Modified'] != ''){ 
          result += '<td>' + props['Date Modified'] + '</td>'; 
         } else { 
          result += '<td></td>'; 
         } 

         result += '</tr>'; 
        } 
       } 
       if (key=='') 
       { 
        result += '<tr><td colspan="4" style="text-align:center"><em>No files found</em></td></tr>'; 
       } 

       result += '</tbody>'; 
       result += '</table>'; 
      } 
     } 
    } else { 
     result += '<h1>Could not retrieve folder contents.</h1>'; 
    } 

    // Add the new markup to the DOM. 
    $('#fileinfo').html(result); 

: 여기

문제의 블록 더 느린 속도를 내지 않고 시작/끝 통화를 설정할 수있는 방법을 찾을 수 없습니다. 나는 이것을 처리해 온 유일한 사람이 될 수 없다는 것을 알고 있습니다. 그래서 이것을 아이디어로 게시하고 싶었습니다. 시도한 모든 페이지 매김 플러그인은 core5가 설정되는 방식으로 작동하지 않았고, 심지어 cfdirectory 구조 프로세스가 영원히 걸릴 수 있습니다. 해피 홀리데이 모두.

+0

당신은 폴더에만 이미지가 포함되어 있습니까? 나는 _isImage()가 무엇을하는지 모르지만 비싸면 파일 확장자로 필터링 할 수 있습니다. 또한 _getDirectoryInfo()의 현재 구현은 안전한 디렉토리에 대한 필터링으로 보이지 않으므로 공격자가 디렉토리를 추측하고 컨텐츠를 나열 할 수 있다는 점에서 보안상의 결함이 될 수 있습니다. 그것은 당신의 코드에서 다른 곳에 있을지 모르지만 나는 그것을 언급 할 것이라고 생각했습니다. – barnyr

+0

또한 ajax 호출에 소요 된 시간과 DOM을 업데이트하는 데 걸린 시간을 비교해 보았습니까? 모든 시간이 CF/AJAX에 있기를 기대하지만, IE 사용자가 더 느려지는 것을 언급하면 ​​DOM 업데이트 방법과 관련이있을 수 있습니다. – barnyr

+0

이미지 만 표시되며 사용자는 UL 이미지 만 사용할 수 있습니다. 나는 게으른 로딩을 추가하는 것이 매우 유용 할 수 있다고 생각하고 있었지만, 그렇지 않을 수도 있습니다. 함수는 cfdirectory 호출을 훨씬 지나치게 늦추지 않는 것처럼 보입니다. –

답변

0

파일이 Windows OS에 저장되어 있습니까? 그렇다면 디렉토리를 중첩하거나 모든 이미지가 중앙 디렉토리에 저장되어 있습니까? 모든 파일을 담고있는 독방 디렉토리 일 때 시간이 지남에 따라 느려짐을 발견했습니다.

날짜 기반 규칙에 따라 파일을 저장하십시오./년/월/일

+0

예, 전자 메일 또는/이벤트 등의 형식으로 저장됩니다. 폴더에 폴더를 중첩시켜야한다고 생각합니다. ( –

관련 문제