アップロードしたファイルをリンクで表示

ファイルをアップロードするには、「ファイルのアップロードコントロール」を使えばいい。 ダウンロードは「ファイルのダウンロードコントロール」を使えばいいのだが、ファイルのアイコンを表示してみる。

これだけでファイルのアップロードページはできてしまう。ソースコードはこんな感じ。

  001: <?xml version='1.0' encoding='UTF-8'?>
  002: <xp:view xmlns:xp="http://www.ibm.com/xsp/core">
  003:   <xp:this.data>
  004:     <xp:dominoDocument var="document1" formName="Event" />
  005:   </xp:this.data>
  006:   <xp:button id="button1" value="Save">
  007:     <xp:eventHandler refreshMode="complete" submit="true" event="onclick">
  008:       <xp:this.action>#{javascript:document1.save();}
  009:         <![CDATA[
  010:           #{javascript:
  011:             document1.save();
  012:           }
  013:         ]]>
  014:       </xp:this.action>
  015:     </xp:eventHandler>
  016:   </xp:button>
  017:   <xp:br />
  018:   <xp:fileUpload id="fileUpload1" value="#{document1.body}" />
  019: </xp:view>
  

では、このページにファイルをダウンロードするためのリンクを追加してみる。

XPagesでは、リッチテキストフィールドに添付したファイルは以下のようなURLでアクセスできることになっている。

  http://hostname/FileUpload.nsf/0/1B383E71DCF1CDE649257A0600595516/$FILE/filename.txt
  

こういう仕組みがあるので、上記のURLを設定したリンクを用意すればいいということがわかる。イメージをつけてやれば、ファイルアイコンも表示できる。

ということで、適当なアイコンを作り、イメージリソースに追加しておく。 先ほどのページに、以下のようなリンクを追加すれば、添付ファイルをダウンロードできる。添付ファイルは複数あるかもしれないので、繰り返しコントロールも使う。

  020:   <xp:repeat id="repeat1" rows="30" var="url">
  021:     <xp:this.value>
  022:       <![CDATA[
  023:         #{javascript:
  025:           var fileList = document1.getAttachmentList("body");
  026:           var unid = document1.getDocument().getUniversalID();
  027:           var path = facesContext.getExternalContext().getRequest().getContextPath();
  028:           var list = [];
  029:           for(var index = 0; index < fileList.length; index++) {
  030:             var attObj:NotesEmbeddedObject = fileList[index];
  031:             var url = path + '/0/' + unid + "/$FILE/" + attObj.getName();
  032:             list.push(url);
  033:           }
  034:           return list;
  035:         }
  036:       ]]>
  037:     </xp:this.value>
  038:     <xp:link escape="true" id="link1" value="#{javascript:url}">
  039:       <xp:image url="/fileicon.png" id="image1" />
  040:     </xp:link>
  041:   </xp:repeat>
  

これで出来上がり。 イメージはこんな感じ。

ファイルアイコンのイメージ

このコードをちょっといじれば、ファイル名などを表示することも可能。