coldfusion의 미리보기 페이지

Question

이미지 파일을 서버에 업로드하고 이미지 파일을 페이지에 표시하는 방법을 알고 있습니다.

하지만 확인 페이지에서 미리보기를 원하면 어떻게해야합니까?

데이터베이스에 저장되지 않지만 실제 위치의 파일 인 임시 파일을 생성 할 수 있지만 "아니오"버튼을 누르기로 결정한 경우 어떻게됩니까? 이 임시 파일은 어떻게 삭제됩니까?

아래의 코드는 이미지를 축소하여 페이지에 표시합니다. 그러나 그것은 또한 OK 또는 NO를 눌렀을 때 그곳에 머물러있는 디렉토리 안에 이미지를 생성합니다. NO는 버튼이고 OK는 자연히 입니다.을 제출하십시오.

<!--- Make Temp Image as Preview ---> 
    <cfset mediapath = expandpath('../images/about')> 
    <cfif structKeyExists(form,"image") and len(form.image)> 
     <cffile action="upload" 
     filefield="image" 
     destination="#MediaPath#" 
     nameconflict="makeunique"> 

     <cfimage name="uploadedImage" 
     source="#MediaPath#/#file.serverFile#" > 
     <cfset imagesize = 320> 

     <cfif uploadedImage.width gt uploadedImage.height> 
      <cfset percentage = (imagesize/uploadedImage.width)> 
      <cfelse> 
      <cfset percentage = (imagesize/uploadedImage.height)> 
     </cfif> 

     <cfset newWidth = round(uploadedImage.width * percentage)> 
     <cfset newHeight = round(uploadedImage.height * percentage)> 
     <!--- Show Image ---> 
    <cfoutput> 

     <img src="../images/about/#file.serverFile#" style="height:#newHeight#; width:#newWidth#;"> 

URL 전달 또는 일종의 CFScript를 수행해야한다고 가정합니다. Return 단추 Onclick 이벤트.

Answer 1

여기 내 접근 방식은 당신이 무엇을 위해 그것을 가져 가라.

이것은 아마도 당신이 필요로하는 것 이상이지만,이 이미지 어딘가에 문제를 삭제해야합니다.

다음은 코드입니다. 하지만 두 페이지로 나누었습니다. 당연히 나는이 페이지와 당신의 폼 핸들링에 어떤 일이 일어나고 있는지 볼 수 없기 때문에 우리가 당신에게주는 것을 시작할 것입니다. structKeyExists의

<cfset mediapath = expandpath('../images/about')> 

좋은 사용() : 여기

<cfif structKeyExists(form,"image") and len(form.image)> 

나는 주 (일시 정지 및 을 .png를 그냥 .gif 참고, .JPEG, .JPG, 당신이 업로드를 제한하는 제안 이미지 유형)을 사용하여 및 모든 파일 형식 업로드를 방지합니다. 아래에 accept 매개 변수를 추가했습니다.

<cffile action="upload" 
    filefield="image" 
    destination="#MediaPath#" 
    nameconflict="makeunique" 
    accept="image/*"> 

<cfimage name="uploadedImage" 
    source="#MediaPath#/#file.serverFile#" > 

확인 업로드 된 파일은 별도의 우려가 파일을 미리보기하려면 내가 그들에게 할이 시점에서

을 할 수 있습니다. 그들이 '미리보기'를 클릭하면 preview.cfm 페이지로 이동합니다.

그런 다음 ID 나 기본 키와 같은 다른 것이없는 경우 전달해야하는 파일 이름이 있습니다.

그래서 나는 그들의 웹 사이트에 어도비의 ColdFusion 문서에서이 편리한 - 멋쟁이 스크립트를 뽑아 나는 '뭔가 다른'로 이름을 설정하려면이 옵션을 사용하기 위하여려고하고있다)

<cfscript> 
theKey="123abc"; 
theKey=generateSecretKey("AES") 
superDuperSecretSoDontTell=encrypt(file.serverFile, theKey, "AES", "hex"); 
</cfscript> 

<a href="preview.cfm?fileName=#superDuperSecretSoDontTell#&theKey=#theKey#">Let's send this piggy!</a> 

을하고 당신이 가고 떨어져 미리보기 페이지로 이동 ...

<cfoutput> 

이것은 pageA.cfm (아래로 가리키는)이 pageB.cfm

입니다

가 지금은 아래 코드의 휴식을 가지고 쿼리 문자열을 통해 통과에 따라 파일을 풀 수있다 (가리키는) 변수/값 쌍.

<cfscript> 
IWannaKnowTheSecret=decrypt(url.fileName, url.theKey, "AES", "hex"); 
</cfscript> 

는 여기 일시 중지하고 방금 .gif 참고, .JPEG, .JPG, (주 이미지 형식) .png를 어떤 및 everyfile 유형을 업로드 방지하기 위해 업로드를 제한 건의 할 것입니다. 아래에 accept 매개 변수를 추가했습니다.

<cffile action="read" file="#MediaPath##IWannaKnowTheSecret#" variable="uploadedImage"> 

<cfset imagesize = 320> 

여기에 흥미로운 핸들이 있습니다. 따라서 두 값 중 더 큰 값을 사용하고 크기를 백분율로 변경하려면 을 사용합니다. 산뜻한.

<cfif uploadedImage.width GT uploadedImage.height> 
    <cfset percentage = (imagesize/uploadedImage.width)> 
<cfelse> 
    <cfset percentage = (imagesize/uploadedImage.height)> 
</cfif> 

<cfset newWidth = round(uploadedImage.width * percentage)> 
<cfset newHeight = round(uploadedImage.height * percentage)> 

는 다음과 같은 형태를 수행

<form action="" method="post" enctype="multipart/form-data"> 
Your current Image: 
<cfoutput> 
Name: #uploadedImage#<br> 
<img src="../images/about/#uploadedImage#" style="height:#newHeight#; width:#newWidth#;"> 
</cfoutput> 
Do you want to remove this?<br> 
<input type="checkbox" 
     name="removeImage" 
     value="1" />: Remove the logo image</cfif><br /> 

Wnat to replace your image?<br> 
<input type="file" name="replacementImage"> (

<input type="hidden" 
     name="uploadedImage" 
     value="<cfoutput>#uploadedImage#</cfoutput>"> 

<input type="submit" value="submit" name="submit"  
</form> 

<a href="#" onclick="javascript:window.history.back(-1);return false;">Cancel and go back</a> 

가 계속 이미지를 수정하거나 교체하십시오. 제출하면 다음과 같은 것을 사용할 수 있습니다. 그리고 우리가 삭제 ...

그리고 제기 replacementImage 파일이 채워진 경우 다음 우리가 파일을 추가 .

그리고 거기 당신은 그것이있다 ...

당신은 몇 가지 우려를 오토넷 있습니다. 개선 된 옵션을 제공하고 있습니다. 변경하거나 변경하지 못하게하고 있습니다. 당신은 그 (것)들에게 당신이 이제까지 어디에서든지 가기 위하여 밖으로주고있다.

편집 : "어떻게이 임시 파일이 삭제 될 것"? 다음은 인코딩 및 디코딩 물건에 대한 증거가 당신이 그것으로 경기하기를 원했지만 경우 (이다

이

<cfscript> 
theKey="123abc"; 
theKey=generateSecretKey("AES"); 
superDuperSecretSoDontTell=encrypt("monkeytoots", theKey, "AES", "hex"); 
</cfscript> 
<cfoutput><a href="?fileName=#superDuperSecretSoDontTell#&theKey=#theKey#">Let's send this piggy!</a></cfoutput> 
<cfif isdefined("url.fileName") and isdefined("url.theKey")> 
<cfscript> 
IWannaKnowTheSecret=decrypt(url.fileName, url.theKey, "AES", "hex"); 
</cfscript> 

<cfoutput> 
#IWannaKnowTheSecret# 
</cfoutput> 
</cfif> 

Answer 2

이 답변은 Adam Cameron의 의견에 대한 응답입니다. 두 개의 제출 버튼으로 발생할 수있는 예상치 못한 결과를 보여줍니다. 이 코드로 시작하십시오.

<cfdump var="#form#"> 
<form action="abc.cfm" method="post"> 
<input type="text" name="text1" /> 
<input type="submit" name="submit1" value="no" /> 
<input type="submit" name="submit2" value="yes" /> 
</form> 

대부분의 기본 동작

, 경우 모든 브라우저는 사용자가 Enter 키를 누를 때 양식이 제출됩니다된다 경우가 있다는 것입니다. 텍스트 상자에 커서를 놓고 Enter 키를 누른 경우이 양식을 통해 무엇을 볼 수 있습니까? 그것을 시도하고 당신이 옳았는지보십시오.