2013-05-15 2 views
1

저는 div를 사용하여 사용자의 프로필 사진을 보유하고 있습니다. 업데이트하려면 사용자가 새 이미지를 선택하고 div의 이전 이미지를 바꿉니다. 그런 다음 사용자가 새 그림을 업로드하기 위해 업데이트를 누르지 만 서버에서 응답을 받고 동일한 div가있는 동일한 페이지가로드되면 div가 이전 이미지로 채워집니다. 나는 이것을 디버거에서 추적했다. div로 업데이트하기 전에 그림에서 멈추고 파일 시스템에서 확인한 다음 (올바른 새 그림이 있음) 디버거를 진행하고 div로 채운다. 2 ~ 2 초 후에 페이지를 새로 고침하면 새 이미지가 나타납니다.div의 이미지 새로 고침

DIV 사진 용기 :

<div id="ProfilePictureBox"></div> 

페이지가로드

function preloadForm() { 
    var url = '/FeatureServer/Authentication?action=getMyDetails&userName=' + userName; 
    var req = $jQuery.ajax({ 
     url: url, 
     type: 'GET', 
     success: function (data, response, xhr) { 
      var pic = data['ProfilePicture']; 
      if (pic.length > 0) { 
       pic = '/FeatureServer/' + pic; 
       // pausing here and checking `pic` in the browser confirms its the correct image 
       $jQuery("#ProfilePictureBox").css("background-image", 'url(' + pic + ')'); 
       // old image is loaded^
      } 
     } 
    }); 
} 
+3

이미지 URL에 시드를 추가하여 캐시 된 결과가 표시되지 않도록 시도 할 수 있습니다. –

+0

@ ajax81 씨앗을 추가하면 무엇을 의미합니까? – Chris

+3

URL 끝에 타임 스탬프를 추가하면 캐시와 "다른"타임 스탬프가 생성됩니다. – Jasen

답변

2

난 당신의 URL에서 변수의 타임 스탬프의 종류를 추가 할 필요가 추측 사업부를 업데이트 할 때이 함수가 호출 이미지 경로가 표시되므로 캐시되거나 오래된 결과 대신 새 결과가 표시됩니다.

예를 들어 아래의 대체 :

pic = '/FeatureServer/' + pic; 

pic = '/FeatureServer/' + pic + "?time=" + (new Date()); 

위에서 새로운 날짜/시간 이미지가 생성 얻을 및 경로마다 고유 각 시간을 추가합니다.

호프로 문제를 해결할 수 있습니다.

+0

불행히도이 일은 나에게 도움이되지 않습니다. 내가 작업하고있는 서버는 파일의 이름을 지정하는 역할을 담당하며, 동일한 username.jpg로 이름을 지정하지 않으면 시스템의 다른 부분이 b/c를 통해 찾고있는 이미지를 찾을 수 없습니다. 위 코드에서 이미지 파일의 이름은 바뀌지 않을 것입니다. @Chris, 매우 불완전하게 프로그래밍되었습니다. -0- – Chris

+1

@Chris. 대신 당신은 이미지 경로에 항상 매번 img 요소에 대해 고유 한 경로가되도록 쿼리 문자열을 추가해야한다는 것을 보여 주려고합니다. –

+0

효과가있었습니다! 나는 단지'(new Date()). getTime()'을해야한다는 것에 주목하고 싶다. Date()는 오늘의 전체 문자열을 반환했습니다. 고맙습니다 :) – Chris