2011-01-18 5 views
3

이 마크 업과 스크립트 사용 Google 크롬 8.0.552.237 OSX (예!) 용 "파일을 데스크톱으로 드래그"링크를 만들 수 있습니다. 내 문제는 동적으로 생성 된 스크립트 파일의 이름을 지정할 수 없다는 것입니다. Google 크롬은 항상 "customFileName.js"라고 지정해야한다고해도 "download.js"라고합니다.Google 크롬 데스크톱으로 드래그하십시오 : 사용자 정의 '파일'이름

누구든지 안내를 해줄 수 있습니까? 이것은 버그입니까, 아니면 제가 잘못하고있는 것입니까? 동적으로 브라우저에서 바이너리 파일을 만드는 것이 가장 중요한 문제 일 수 있다는 것을 알고 있습니다. 파일 이름을 지정할 수 있다는 것은 특정 응용 프로그램에 많은 사용법이 될 것입니다. m 건물. 소스 코드는 미리 감사드립니다.

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
     <script> 

      var mimeType= 'text/javascript' 
      , javaScript= 'alert("hello");' 
       // convert javascript to binary string 
      , binaryText= btoa(javaScript) 
       // create data uri 
      , dataUri= "data:text/javascript;charset=utf-8;base64," + binaryText 
       // a conventional http url pointing to an image 
      , resourceUri= 'http://www.chromium.org/_/rsrc/1220198801738/' 
          + 'config/app/images/customLogo/customLogo.gif?revision=2' 

       // drag this link to your desktop or other folder and 
       // Google Chrome will download a file to that location 
       // called "download.js" - it should be called "customFileName.js" 
      , draggableScriptAnchor= document.createElement('a') 

       // drag this link to your desktop or other folder and 
       // Google Chrome will download a file to that location 
       // called "customFileName.gif" as expected 
      , draggableResourceAnchor=document.createElement('a') 

      // setup drag to desktop 

      // set this anchors href to the data uri 
      draggableScriptAnchor.href= dataUri; 
      draggableScriptAnchor.innerText= 'Drag dynamic script'; 
      // listen for drag events 
      draggableScriptAnchor.addEventListener 
      (
       'dragstart' 

      , function (mouseEvent) 
       { 
        mouseEvent.dataTransfer.setData 
        (
         "DownloadURL" 
         // note that the convention for this string is 
         // mimetype:filename:url and that the "file" 
         // is given the name "customFileName.js" 
        , "text/javascript:customFileName.js:" + dataUri 
        ) 
       } 

      , false  
      ); 

      // set this anchors href to a conventional http url 
      draggableResourceAnchor.href= resourceUri 
      draggableResourceAnchor.innerText= "Drag image"; 

      // listen for drag events 
      draggableResourceAnchor.addEventListener 
      (
       'dragstart' 

      , function (mouseEvent) 
       { 
        mouseEvent.dataTransfer.setData 
        (
         "DownloadURL" 
         // as above, except that this time the mimetype 
         // is image/gif and the file name is customFileName.gif 
         // THIS WORKS AS EXPECTED 
        , "image/gif:customFileName.gif:" + resourceUri 
        ) 
       } 
      ) 

      // add elements to the DOM 
      document.body.appendChild(draggableScriptAnchor); 
      document.body.appendChild(document.createElement('br')); 
      document.body.appendChild(draggableResourceAnchor); 
     </script> 
    </body> 
</html> 

답변

2

Chrome에 버그가있는 것 같습니다. 'Drag and drop of 'DownloadURL' type ignores specified filename for data URLs'문제가 최근에 수정되었으므로 Chrome 버전 13에서 수정되어야합니다.

누군가 시험하려는 경우이 메시지를 확인하십시오 (live example).

+0

거의 1 년 후 - 그것이 사실임을 확인할 수 있습니다. 버그, 그리고 그것이 지금은 크롬 19에서 작동합니다 (아마 그 이전에 고정) – VLostBoy

0

WIN7에서 코드를 실행하면 파일 이름이 .js 확장자없이 '다운로드'됩니다. Win 2008에서 실행하면 정확한 파일 이름 (customFileName.js)이 표시됩니다.

+0

모든 파일 확장자를 표시하도록 win7을 구성 했습니까? –

+0

의견을 보내 주셔서 감사합니다. Ashot- @ James- 감사합니다. 그러나 관련있는 점이 없습니다. OS가 아니라 Chromes 동작에 대해 알고 싶습니다. – VLostBoy

+0

나의 요점은 Ashot에게 명확한 질문이었습니다. 그는 파일 이름은 다운로드 만한다고했지만 모든 확장명을 표시하도록 구성하지 않은 경우 파일 이름은 download.js가 될 수 있지만 .js는 숨겨집니다. –