使用ajax将图像上传到文件数据库有疑问


Doubts in uploading image into file database using ajax

专注于问题,

我有以下HTML

 <form enctype="multipart/form-data" onsubmit="uploadProfilePicture();" method="post" name="prof_picture">
 <input id="upload_profile_picture" style="display:none;"name="image" accept="image/jpeg" type="file">
 <input id="upload_profile_picture2" value="Submit" type="submit" style="display:none;">
 <a id="change_profile_picture" class="profile_option" onclick="$('#upload_profile_picture').click();">Mudar foto de perfil</a>

PHP(profileFunctions.PHP)

if(isset($_POST['prof_picture'])){
    alert("test");
}

JS

function uploadProfilePicture(){
    $.ajax({
            type:'POST',
            url: "profile/profileFunctions.php",
            data:$(this).serialize(),
            cache:false,
            success:function(data){
                console.log("success");
                console.log(data);
            },
            error: function(data){
                console.log("error");
                console.log(data);
            }
        });
}

我以前使用过ajax,但事实上我真的很怀疑,因为这个文件是一个图像:

1ºajax请求中的"data:"中究竟应该包含什么?什么我应该如何正确解析文件?

2º在PHP图像验证中,我如何检索文件以及我应该如何进行isset($_POST)?

3º如果ajax.success,我将立即向用户推荐图像缓存应该设置为true吗?缓存在这种情况下的表现如何?

XHR技术不允许上传图像。

你必须找到一个变通办法,比如使用iframe。

请使用iframe而不是ajax。

<form target="my_iframe_name" action="my_script_can_receive_file.php" ....>
...
</form>
<iframe name="my_iframe_name"  onload="javascript:alert('uploaded')" style="width:1px;height:1px;position:absoulte;left:-99999px;top:-99999px" src="javascript:void(0)"></iframe>

但是,如果你想检查上传的状态,你可能需要在[my_script_can_receive_file.php]和[js]上做更多的工作来与主框架对话状态。