Question

我正在尝试创建一个允许用户上传个人资料图片的简单表单。为了避免不得不处理太多的symfony代码，我使用picEdit并将表单直接嵌入到相应的twig模板（链接到picEdit .css和.js文件以及jquery）。此表单位于boostrap模式对话框中，如下所示：

<div class="modal-dialog">
<div class="modal-content animated fadeIn">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <i class="fa fa-upload modal-icon"></i>
        <h4 class="modal-title">Profile picture</h4>
        <small>Use the options below to upload and edit your profile picture.</small>
    </div>
    <div class="modal-body" style="text-align: center">
        <form action="upload.php" method="post" id="avatarUploadForm" name="avatarUploadForm" enctype="multipart/form-data">
        <input type="file" name="avatarImage" id="avatarImage">
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
        <button type="submit" id="uploadButton" name="uploadButton" class="btn btn-primary">Upload Picture</button>
    </form>
    </div>
</div>

我还在模板中添加了以下java脚本函数：

<script type="text/javascript">
   $(function() {
       $('#avatarImage').picEdit();
   });
</script>

表单操作指向upload.php，如下所示（以简单的形式）并存储在web/upload.php中：

<?php

if (isset($_POST['uploadButton'])){
   $file = $_FILES['avatarImage']['name'];
   move_uploaded_file($file,"/avatars/$file");
}

?>

当我点击上传图片按钮时，我会看到如下所示的成功通知，但该文件没有显示在发送它的目录中，我怀疑是上传。 php脚本永远不会被触发。关于我可能做错的任何建议？ *免责声明：我是php / symfony / java脚本的新手

enter image description here

Answer 1

您使用错误的键移动。将upload.php更改为：

if (isset($_POST['uploadButton'])){
   $file = $_FILES['avatarImage']['tmp_name'];
   $fileName = $_FILES['avatarImage']['name'];
   if(move_uploaded_file($file,"/assets/img/$fileName")){
       header('Content-Type','application/json');
       echo json_encode(array(
           'status' => 'success'
       ));
   }
   else{
       header('Content-Type','application/json');
       echo json_encode(array(
           'status' => 'failed'
       ));
   }
}

http://php.net/manual/en/function.move-uploaded-file.php

您也不应该依赖上传文件的文件名，这是注入的可能性。使用其他一些命名方案或通过scrubber运行名称。

使用此特定插件我也不确定您打算如何将图像绑定回用户实体。这个插件似乎只处理上传。

确保上传文件时没有收到错误：

$('#image').picEdit({
    formSubmitted: function(response){
       console.log(response);
    }
});

Symfony方法

使用表单和控制器。这将使您可以访问更多内容，并为您节省更新用户个人资料图像的步骤。

我们将做出一些假设。首先，只有登录用户才会更改其个人资料。其次，所有目录都具有适当的权限。最后，您正在使用注释进行路由

//ProfileController

...
/**
 * @Route('/upload-profile-image', name="upload_profile_image")
 * @Method({"POST"})
 */
public function uploadProfilePictureAction(Request $request)
{

    $em = $this->getDoctrine()->getManager();
    $user = $em->getRepository('UserBundle:User')->findOneById($this->getUser()->getId());
    $form = $this->createFormBuilder($user)
        ->add('avatarImage','file')
        ->getForm();

    $form->handleRequest($request);
    if($form->isValid()){
        $user->upload();
        $em->flush();
        return new JsonResponse(array(
            'status'=>'success'
        ));
    }
    return new JsonResponse(array(
        'status' => 'failed',
        'message' => $form->getErrors(true)
    ));
}

然后确保您的用户实体设置具有此处所述的正确功能：http://symfony.com/doc/current/cookbook/doctrine/file_uploads.html

然后只需将表单更改为：

<form action="{{ path('upload_profile_image') }}" ...>

使用picEdit和symfony上传图片

1 个答案: