使用Ajax与PHP提交带附件的表单无法传递数据及附件问题求助

一、前端JS代码优化 #

原有JS逻辑核心配置是正确的，补充以下校验和调试逻辑即可：

function kk_sendmail() {
    // 原有字段获取逻辑不变
    var kk_vtype= $("#vtype").val();
    var kk_departm= $("#departm").val();
    var kk_recepient= $("#recepient").val();
    var kk_user= $("#euser").val();
    var kk_smssubject= $("#smssubject").val();
    var kk_compose_textarea= $("#compose-textarea").val();
    var form_data = new FormData();

    // 新增附件存在性校验
    const attachFile = $('#attachments').prop('files')[0];
    if (!attachFile) {
        alert('请先选择需要上传的附件');
        return;
    }
    form_data.append('attach', attachFile);

    form_data.append('vtype',kk_vtype);
    form_data.append('departm',kk_departm);
    form_data.append('recepient',kk_recepient);
    form_data.append('euser',kk_user);
    form_data.append('smssubject',kk_smssubject);
    form_data.append('compose-textarea',kk_compose_textarea);
        
    $.ajax({
        type: "POST",
        url: "process.php",
        dataType: 'text',
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,
        success : function(text){
            if (text == "success"){
                formSuccess();
            } else {
                // 打印后端返回的原始内容，方便排查错误
                console.log('后端返回异常：', text);
            }
        },
        // 新增错误回调，捕获请求层面的错误
        error: function(xhr, errType, errMsg) {
            console.log('请求失败：', errType, errMsg, xhr.responseText);
        }
    });
};

二、后端PHP接收逻辑参考 #

普通表单字段通过$_POST获取，附件通过$_FILES获取，示例代码如下：

<?php
// 调试用：把所有接收的数据写入日志文件，确认数据是否正常传递
// file_put_contents('./debug.log', "POST数据：\n".print_r($_POST, true)."\n附件数据：\n".print_r($_FILES, true));

// 接收普通表单字段
$vtype = $_POST['vtype'] ?? '';
$departm = $_POST['departm'] ?? '';
$recepient = $_POST['recepient'] ?? '';
$euser = $_POST['euser'] ?? '';
$smssubject = $_POST['smssubject'] ?? '';
$content = $_POST['compose-textarea'] ?? '';

// 处理附件
$uploadRes = false;
if (isset($_FILES['attach']) && $_FILES['attach']['error'] === UPLOAD_ERR_OK) {
    $tmpPath = $_FILES['attach']['tmp_name'];
    $saveName = date('YmdHis').'_'.basename($_FILES['attach']['name']);
    $savePath = './upload/'.$saveName; // 提前在同级目录创建upload目录，授予写入权限
    $uploadRes = move_uploaded_file($tmpPath, $savePath);
}

// 后续业务逻辑处理...

// 返回结果
echo 'success';

三、常见异常排查点 #

• 确认PHP配置正常：php.ini中file_uploads = On，upload_max_filesize和post_max_size值不小于上传附件的大小
• 确认附件存储目录有写入权限，Linux环境可执行chmod 755 upload给目录授权
• 如果前端与PHP接口不同域，需要在PHP代码开头添加跨域头：

  header('Access-Control-Allow-Origin: *');
  

• 确认使用的jQuery版本不低于1.9，低版本jQuery不支持FormData传参

内容的提问来源于stack exchange，提问作者Mamouz