jQuery Ajax ファイルのアップロード (php)

jQueryのAjaxファイルアップロード、PHP忠実なファイルアップロードの実装方法
AJAXアップロードファイル、PHPアップロードファイル。

【PHPファイルアップロード】

始める前に、WEB経由でファイルをアップロードする原理を簡単に説明する必要があると思います。
実際、ここでアップロードされたファイルを処理するのが PHP、JSP、または ASP であっても、WEB はすでにファイルをサーバーにアップロードしています。アップロードされたファイルを処理するためにアップロード処理関数を使用します。
処理機能は通常、PHP、JSP、ASPなどのサーバーサイド言語で実装されます。では、WEB (HTTP プロトコル?) 経由でファイルをアップロードするには、次のような HTML コードが必要です:
test.html

<form action="do_file_upload.php" method="post" enctype="multipart/form-data">
<p>Pictures:
<input type="file" name="picture" />
<input type="submit" value="Send" />
</p>
</form>

注: enctype="multipart/form-data" が必要です。FORM テーブルにこれを伝えます。ファイルアップロードタイプ。リクエストが成功すると、ファイルはサーバーの一時フォルダーにアップロードされます。ファイルが宛先に到達した後にどのように処理されるかは、PHP、JSP、および ASP の問題です。
(ただし、すぐに満足しないでください。ファイルが他の場所に移動されていないか、名前が変更されていない場合、ファイルはフォームリクエストの最後に削除されます。そのため、アップロードされたファイルを処理するスクリプトを作成する必要があります)
ここでは、PHP を使用して
do_file_upload.php

<?php
$error = ""; //上传文件出错信息
$msg = "";
$fileElementName = &#39;picture&#39;;
    $allowType = array(".jpg",".gif",".png"); //允许上传的文件类型
    $num      = strrpos($_FILES[&#39;picture&#39;][&#39;name&#39;] ,&#39;.&#39;);  
$fileSuffixName    = substr($_FILES[&#39;picture&#39;][&#39;name&#39;],$num,8);//此数可变  
$fileSuffixName    = strtolower($fileSuffixName); //确定上传文件的类型

$upFilePath             = &#39;d:/&#39;; //最终存放路径
if(!empty($_FILES[$fileElementName][&#39;error&#39;]))
{
   switch($_FILES[$fileElementName][&#39;error&#39;])
   {
    case &#39;1&#39;:
     $error = &#39;传的文件超过了 php.ini 中 upload_max_filesize 选项限制的值&#39;;
     break;
    case &#39;2&#39;:
     $error = &#39;上传文件的大小超过了 HTML 表单中 MAX_FILE_SIZE 选项指定的值&#39;;
     break;
    case &#39;3&#39;:
     $error = &#39;文件只有部分被上传&#39;;
     break;
    case &#39;4&#39;:
     $error = &#39;没有文件被上传&#39;;
     break;
    case &#39;6&#39;:
     $error = &#39;找不到临时文件夹&#39;;
     break;
    case &#39;7&#39;:
     $error = &#39;文件写入失败&#39;;
     break;
    default:
     $error = &#39;未知错误&#39;;
   }
}elseif(empty($_FILES[&#39;fileToUpload&#39;][&#39;tmp_name&#39;]) || $_FILES[&#39;fileToUpload&#39;][&#39;tmp_name&#39;] == &#39;none&#39;)
{
   $error = &#39;没有上传文件.&#39;;
}else if(!in_array($fileSuffixName,$allowType))
{
   $error = &#39;不允许上传的文件类型&#39;; 
}else{
  );
   if($ok === FALSE){
    $error = &#39;上传失败&#39;;
   }
}
?>

を処理します

もう 1 つの注意: $_FILES 配列について

この配列には、アップロードされたすべてのファイル情報が含まれており、ファイルのアップロード時に関連情報が記録されます。
上記の例の$_FILES配列の内容は以下の通りです。上の例に示すように、ファイル アップロード フィールドの名前が userfile であると仮定します。名前は何でも構いません。

$_FILES['userfile']['name']

クライアント マシン ファイルの元の名前。

$_FILES['userfile']['type']

ファイルの MIME タイプ (ブラウザーがこの情報を提供する場合)。例は「画像/gif」です。ただし、この MIME タイプは PHP 側ではチェックされないため、鵜呑みにしないでください。

$_FILES['userfile']['size']

アップロードされたファイルのサイズ (バイト単位)。

$_FILES['userfile']['tmp_name']

ファイルのアップロード後にサーバーに保存される一時ファイル名。

$_FILES['userfile']['error']

ファイルのアップロードに関連するエラー コード。このプロジェクトは PHP バージョン 4.2.0 で追加されました。

[AJAX ファイルアップロード]

実際には、更新不要のファイルアップロードを実現するためのものです。 IFRAME ファイルのアップロード原則を使用できます。

実際にPHPでファイルをアップロードするとき。 。 。 $_FILES 形式のみを使用できますが、..document.getElementById('img').value のように JS を使用して ID を取得するだけの場合は、フォーム内の jquery $("#img") は実際にはアップロードできません (ただし、最初の私を含め、これを実行している人はまだたくさんいます)。
しかし、この機能にはいわゆる「非同期アップロード」の実装も必要です。どうすればよいでしょうか? ?サードパーティのコンポーネントを使用するか、自分でコンポーネントを作成する (Web ページに IFRAME を埋め込む) ことのみ可能です。ただし、開発時間を考慮する場合は、「ajaxfileupload.js」という優れた jQuery Ajax ファイル アップロード コンポーネントを使用できます。そのコンポーネントのダウンロード アドレスは http://www.phpletter.com/ です。ダウンロード後にPHPアプリケーションのデモが入っており、わかりやすいです。
処理:
(1) フロントエンドのファイルのコード: test.php

    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="ajaxfileupload.js"></script>
    <script type="text/javascript">
       function ajaxFileUpload()
               {
                  $.ajaxFileUpload
                     (
                       {
                            url:&#39;doajaxfileupload.php&#39;, //你处理上传文件的服务端
                            secureuri:false,
                            fileElementId:&#39;img&#39;,
                            dataType: &#39;json&#39;,
                            success: function (data)
                                  {
                                    alert(data.file_infor);
                                  }
                               }
                         )
                       return false;
                 } 
     </script>

対応するHTML:

        <input id="img" type="file" size="45" name="img" class="input">
        <button class="button" id="buttonUpload" onclick="return ajaxFileUpload();">Upload</button>

以上でクライアントが完成します。

(2) サーバー側 doajaxfileupload.php

ここでは、実際に値が渡されたかどうかを簡単に検知するために、保存しておきます。 $ file_infor = var_export ($ _ files, true);

file_put_contents ("d: file_infor.php". $ File_infor); で、 - 生成された file_infor.php ファイルをヒットすると、見慣れた情報が再び表示されました。

     array(
             'name'=>'lamp.jpg',
             'type'=>'image/pjpeg',
             'tmp_name'=>'c:\windows\temp\phpFA.tmp',
             'error'=>0,
             'size'=>3127
         )

もちろん、実際の処理は次のようになります:

   <?php
     $upFilePath = "d:/";
     );
   if($ok === FALSE){
    echo json_encode(&#39;file_infor&#39;=>&#39;上传失败&#39;);
   }else{
    echo json_encode(&#39;file_infor&#39;=>&#39;上传成功&#39;);
   }
   ?>

もう 1 つの注意: 実際、ページに IFRAME を埋め込み、JQUERY のこのプラグインでネイティブの POST フォーム送信を使用することもできます。はこのように使用します。動的に生成された IFRAME とフォームであるというだけです

jQuery Ajax ファイルアップロード (php) 関連の記事については、PHP 中国語 Web サイトに注目してください。