これはInterSystems FAQ サイトの記事です。
HTMLからRESTを使って画像ファイルをアップロードする方法をご紹介します。
1.はじめに、以下のようなhtmlとクラスを作成してください。
*UploadTest.html
<html lang="ja">
<head>
<title>Upload</title>
</head>
<body>
<input id="up" type="file" />
<button id="btn">Upload</button>
<div></div>
<script type="text/javascript">
const sendfile = function(e) {
let up = document.getElementById("up");
let file = up.files[0];
let fd = new FormData();
fd.append("imgfile", file);
let xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
var result = document.querySelector('div');
xmlhttp.onload = function () {
result.innerHTML = xmlhttp.responseText;
};
};
xmlhttp.open("POST", "http://127.0.0.1:52773/csp/user/isjtest/uploadimg", true);
xmlhttp.send(fd);
}
let btn = document.getElementById("btn");
btn.addEventListener("click", sendfile);
</script>
</body>
</html>
*User.MyREST.cls (IRIS/CachéサーバのUSERネームスペースに作成してください)
※こちらのサンプルでは、C:\tempフォルダにファイルをUploadしています。
適宜フォルダを作成して頂くか、任意のフォルダパスに変更して再コンパイルしてください。
Class User.MyREST Extends %CSP.REST
{
Parameter CONVERTINPUTSTREAM = 1;
Parameter HandleCorsRequest = 1;
XData UrlMap
{
<Routes>
<Route Url="/uploadimg" Method="POST" Call="readMimeData" />
</Routes>
}
ClassMethod readMimeData() As %Status
{
set upload=$g(%request.MimeData("imgfile", 1))
set fname=%request.MimeData("imgfile",1).FileName
set file=##class(%File).%New("c:\temp\"_fname)
do file.Open("NWUK\BIN\")
do file.CopyFrom(upload)
set st = file.%Save()
if st {
write fname_" アップロード完了!!"
} else {
write fname_" アップロード失敗"
}
do file.Close()
quit $$$OK
}
}
2. ウェブ・アプリケーション /csp/user/isjtest の定義を作成します。
管理ポータル:[システム管理]>[セキュリティ]>[アプリケーション]>
[ウェブ・アプリケーション]>[新しいウェブ・アプリケーションを作成]
RESTのディスパッチ・クラスに、1.で作成したUser.MyRESTクラスを指定します。(下記画像参照)
3. 必要に応じて UploadTest.html を編集し(※1)、Webサーバのドキュメントルート(※2)に配置します。
※1. xmlhttp.openには、環境にあったIPアドレス・ポートを指定してお試しください。
xmlhttp.open("POST", "http://<サーバIP>:<IRIS/Cachéポート>/csp/user/isjtest/uploadimg", true);
※2. 例:C:\inetpub\wwwroot
4. クライアントブラウザより以下を実行し、任意のファイルをUploadします。
http://localhost/UploadTest.html
5. 指定したフォルダにファイルがUploadされたことをご確認ください。
この投稿を参考にさせて頂き、初めてRESTでIRISへの接続をするプログラムを作成してみました。何となく思った通りに動作しそうな雰囲気です。アプリケーション開発環境での組み込みができていませんので、まだ何が起こるか不安がよぎっていますが、現時点では満足しています。本日は力尽きました...
私の場合、すでに構築済みの手法(フレームワーク、と呼べるほど大層なものではなりません)があり、その手法に合わせるために、敢えてJSONを利用していません。そのため、多くのRESTのサンプルコードがJSON前提ということもあり参考になるものが見当たらず、苦しみました。(自業自得、ですが..)
ところで、上記のサンプルコード(UploadTest.html のJavaScript部分)についてです。
var result = document.querySelector('div');
のコードがありますが、「div」に対応するオブジェクト(タグ)が無いように思われます。その為?サーバーからのレスポンスが画面上に表示されないようです。ご確認頂ければ幸いです。
RESTでIRISへの接続をお試しいただきありがとうございます。
<div></div> ←このタグを追加
また、サンプルコードへのご指摘ありがとうございます。
確かに、タグが抜けておりました。大変失礼いたしました。
サンプル(UploadTest.html)に足りないタグを追加しました。
お手数をおかけしますが、ご確認をよろしくお願いいたします。
<button id="btn">Upload</button>
ご確認とコードの改修、有難う御座いました。
重箱の隅をつつくような内容でしたがご対応頂き感謝いたします。