首頁猿問 jQueryAjax文件上傳PHP

jQueryAjax文件上傳PHP

JQuery JavaScript PHP

呼啦一陣風(fēng) 2019-06-01 10:37:17

jQueryAjax文件上傳PHP我想實現(xiàn)一個簡單的文件上傳在我的內(nèi)聯(lián)網(wǎng)頁面，與最小的設(shè)置可能。這是我的HTML部分：<input id="sortpicture" type="file" name="sortpic" /><button id="upload">Upload</button>這是我的JS jQuery腳本：$("#upload").on("click", function() { var file_data = $("#sortpicture").prop("files")[0]; var form_data = new FormData(); form_data.append("file", file_data); alert(form_data); $.ajax({ url: "/uploads", dataType: 'script', cache: false, contentType: false, processData: false, data: form_data, type: 'post', success: function(){ alert("works"); } });});該網(wǎng)站的根目錄中有一個名為“上載”的文件夾，其中包含“用戶”和“IIS_USERS”的更改權(quán)限。當我選擇帶有文件表單的文件并按下Upload按鈕時，第一個警報返回“[ObjectFormData]”。第二個警報沒有被調(diào)用，并且“上傳”文件夾也是空的！？有人能幫我找出什么不對勁嗎？另外，下一步應(yīng)該是用服務(wù)器端生成的名稱重命名文件。也許有人也能給我一個解決辦法。

查看完整描述

4 回答

翻過高山走不出你

TA貢獻1875條經(jīng)驗獲得超3個贊

您需要一個運行在服務(wù)器上的腳本來將文件移動到上載目錄。jQueryajax方法(在瀏覽器中運行)將表單數(shù)據(jù)發(fā)送到服務(wù)器，然后服務(wù)器上的腳本處理上載。下面是一個使用PHP的示例。

HTML很好，但是更新JS jQuery腳本如下所示：

$('#upload').on('click', function() {
    var file_data = $('#sortpicture').prop('files')[0];   
    var form_data = new FormData();                  
    form_data.append('file', file_data);
    alert(form_data);                             
    $.ajax({
        url: 'upload.php', // point to server-side PHP script 
        dataType: 'text',  // what to expect back from the PHP script, if anything
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success: function(php_script_response){
            alert(php_script_response); // display response from the PHP script, if any
        }
     });});

現(xiàn)在，對于服務(wù)器端腳本，在本例中使用PHP。

upad.php*運行在服務(wù)器上并將文件定向到上載目錄的PHP腳本：

<?php    if ( 0 < $_FILES['file']['error'] ) {
        echo 'Error: ' . $_FILES['file']['error'] . '<br>';
    }
    else {
        move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name']);
    }?>

另外，關(guān)于目標目錄的一些事情：

確保你有
正確的服務(wù)器路徑
，即從PHP腳本位置開始，上傳目錄的路徑是什么，以及
確保它是
可寫.

還有一些關(guān)于PHP函數(shù)的內(nèi)容move_uploaded_file，用于upad.php劇本：

move_uploaded_file(

    // this is where the file is temporarily stored on the server when uploaded
    // do not change this
    $_FILES['file']['tmp_name'],

    // this is where you want to put the file and what you want to name it
    // in this case we are putting in a directory called "uploads"
    // and giving it the original filename
    'uploads/' . $_FILES['file']['name']);

$_FILES['file']['name']文件上傳時的名稱。你不用這個。您可以為文件指定任何名稱(與服務(wù)器文件系統(tǒng)兼容)：

move_uploaded_file(
    $_FILES['file']['tmp_name'],
    'uploads/my_new_filename.whatever');

最后，要注意PHPupload_max_filesize和post_max_size配置值，并確保您的測試文件不超過任何一個。這里有一些幫助你檢查PHP配置以及你是如何設(shè)置最大文件大小和POST設(shè)置.

反對回復(fù) 2019-06-01

幕布斯6054654

TA貢獻1876條經(jīng)驗獲得超7個贊

var formData = new FormData($("#YOUR_FORM_ID")[0]);$.ajax({
    url: "upload.php",
    type: "POST",
    data : formData,
    processData: false,
    contentType: false,
    beforeSend: function() {

    },
    success: function(data){




    },
    error: function(xhr, ajaxOptions, thrownError) {
       console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
    }});

反對回復(fù) 2019-06-01

浮云間

TA貢獻1829條經(jīng)驗獲得超4個贊

這是接收上行文件的php文件。

<?$data = array();
    //check with your logic
    if (isset($_FILES)) {
        $error = false;
        $files = array();

        $uploaddir = $target_dir;
        foreach ($_FILES as $file) {
            if (move_uploaded_file($file['tmp_name'], $uploaddir . basename( $file['name']))) {
                $files[] = $uploaddir . $file['name'];
            } else {
                $error = true;
            }
        }
        $data = ($error) ? array('error' => 'There was an error uploading your files') : array('files' => $files);
    } else {
        $data = array('success' => 'NO FILES ARE SENT','formData' => $_REQUEST);
    }

    echo json_encode($data);?>

反對回復(fù) 2019-06-01