1

誰か (できればプログラム) が大きなバイナリ ファイルを送信し、そのファイルの ID を受け取ることができる Web API を作成しようとしています。method="POST"標準の multipart/form-data MIME タイプを使用して、フォーム ( ) と<input type="file" ...>PHP コードにファイルを送信できる要素を含む HTML があります。PHP は ID を生成し、その結果として出力します。別の HTML ページにリダイレクトしたり、HTML 自体を生成したりするのではなく、PHP は単純に ID を出力するため、見栄えはよくありませんが、プログラムによるファイル送信 API の使用目的には十分であることが期待されます。

ここまでは順調ですね。返された ID をクライアント側のコードで取得し、それを使用して他の API を呼び出す場合は、注意が必要です。クライアントが JavaScript を使用した Web ページである場合、クライアントは を使用する必要があるように見えXMLHttpRequestますが、ユーザーがファイル入力コントロールで選択したファイルを使用するためにそのオブジェクトを取得する方法が明確ではありません。

手動で操作する Web フォーム (UI とテストを簡単にするため) と純粋にプログラムによる呼び出し (JavaScript、curl/libcurl など) の両方で同じ API が機能することを望みます。クエリ文字列に ID を含む別のページへのリダイレクトを PHP に発行させたくありません。また、HTML を直接返したくありません。シンプルなファイル入力、ID 出力 API が必要なだけです。

これは難しいことが証明されているので、私は物事を間違った方向に進めているのではないかと疑っています. 私は別のデザインにもオープンですが、物事をできるだけシンプルに保つことを好みます. やや似た質問を見つけましたが、Java中心すぎて、私の問題に完全には対応していません。

4

2 に答える 2

1

私は似たようなことをしなければなりませんでしたが、最終的にフォームを非表示の iframe に送信することになりました。PHP からの応答は、iframe の onload ハンドラで簡単に取得できます。

実際、私が使用したコードは次のとおりです。

    $('submitdestination').onload=function(){
        var appID=this.contentDocument.body.children[0].innerHTML;
        //did something with appID
        new mBox.Notice({type: 'ok',delayClose: 1000,content: 'Data saved.',position: {y: 'bottom',x: 'right'}});//displayed message
    }
    $('cvdetails').submit();

注：submitdestination私のiframeです。cvdetails私の形です。フォームのターゲットは に設定されましたsubmitdestination。また、ドルの引数にハッシュがないことに誰かが気付いた場合に備えて、Mootools を使用しています。

これは、私が使用した HTML の簡略版です (ただし、iframe は変更されていません)。

<form id="cvdetails" name="cvdetails" action="scripts/upload.php" method="post" enctype="multipart/form-data" target="submitdestination" autocomplete="off">
    <button type="button" id="save" class="mainbutton">Save</button>
</form>
<iframe id="submitdestination" name="submitdestination" style="display:none" ></iframe>

保存ボタンには、次のように縮小できるクリック ハンドラーがありました。

$('save').addEvent('click',function(evt){evt.stop();$('cvdetails').submit();})
于 2012-10-15T06:17:52.190 に答える
0

@Asad の助けのおかげで、思い通りに動作させることができました。すべてをまとめると、基本的に次のコードがあります。

<html>
    <head>
        <script type="text/javascript">

window.onload = function(){
    setUploadID(-1);
    document.getElementById('hidden_iframe').onload = captureUploadID;
}

function setUploadID(id)
{
    document.getElementById('upload_id').innerHTML = id;
}

function captureUploadID()
{
    var upload_id = this.contentDocument.body.childNodes[0].textContent;
    setUploadID(upload_id);
}
        </script>
    </head>
    <body>
        <form action="upload.php" enctype="multipart/form-data" method="POST" target="hidden_iframe">
            File: <input type="file" name="media" /><br>
            <input type="submit" value="Upload" />
        </form>
        <br>
        Upload ID: <span id="upload_id"></span>
        <iframe id="hidden_iframe" style="display: none;"></iframe>
    </body>
</html>
于 2012-10-16T19:20:25.750 に答える