Magento 2，带有图像选择器参数的新小部件，不保存图片

我创建了一个新的小部件，其中一个参数是图片选择器，我只是使用此 代码。一切看起来都很好。我可以打开媒体文件夹并选择要使用的图片。选择图片时，表单上的图片字段将填充以下值：

http://local.magento.com/admin/cms/wysiwyg/directive/___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvcHVycGxlLmpwZyJ9fQ,,/key/4c150d984998702b74709bb8f05820aff2f85a968b47d2ce50f963

但是，当我保存表单窗口小部件数据时，图片字段具有以下值： {{media url=

而已。我该如何解决？

如果要上传图像，那么为什么不使用图像选择按钮。
如果您喜欢编辑器，请使用它，但这不是使用编辑器上传图像的正确方法，您可以使用按钮。如果您不知道该怎么做。让我解释。

这是我的代码。下面的代码写在创建按钮的块文件中。

$fieldset->addField(
        'image',
        'file',
        [
            'name' => 'image',
            'label' => __('Image'),
            'title' => __('Image'),
        ]
    );

图像是数据库字段名称。在您的情况下，它是所见即所得的编辑器。我不知道确切的信息，但是一旦您检查了数据库。

以下代码用于将图像保存在表中。现在，将此代码放入您的控制器。

<?php
namespace Vendor\Module\Controller\Adminhtml\Slider;

use Magento\Framework\App\Filesystem\DirectoryList;

class Save extends \Magento\Backend\App\Action

{

protected $_mediaDirectory;
protected $_fileUploaderFactory;

public function __construct(
    \Magento\Backend\App\Action\Context $context,        
    \Magento\Framework\Filesystem $filesystem,
    \Magento\MediaStorage\Model\File\UploaderFactory $fileUploaderFactory
) 
{
    $this->_mediaDirectory = $filesystem->getDirectoryWrite(\Magento\Framework\App\Filesystem\DirectoryList::MEDIA);
    $this->_fileUploaderFactory = $fileUploaderFactory;
    parent::__construct($context);
}

public function execute()
{
    /*For Image Upload*/

    /** @var \Magento\Framework\Controller\Result\Redirect $resultRedirect */
    $resultRedirect = $this->resultRedirectFactory->create();

    try{
        $target = $this->_mediaDirectory->getAbsolutePath('imagefolder/');

        $targetOne = "imagefolder/";
        /** @var $uploader \Magento\MediaStorage\Model\File\Uploader */
        $uploader = $this->_fileUploaderFactory->create(['fileId' => 'image']);
        /** Allowed extension types */
        $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png', 'zip', 'doc']);
        /** rename file name if already exists */
        $uploader->setAllowRenameFiles(true);
        /** upload file in folder "mycustomfolder" */
        $result = $uploader->save($target);
        /*If file found then display message*/
        if ($result['file']) 
        {
            $this->messageManager->addSuccess(__('File has been successfully uploaded')); 
        }
    }
    catch (Exception $e) 
    {
        $this->messageManager->addError($e->getMessage());
    }
    /*For Image Upload Finished*/ 

    $data = $this->getRequest()->getPostValue();

    $data['image'] = $targetOne.$result['file'];

    if (!$data) {
        $this->_redirect('*/*/filenaem');
        return;
    }
    try {

        $rowData = $this->_objectManager->create('Vendor\Module\Model\Slider');

        $rowData->setData($data);

        if (isset($data['id'])) 
        {
            $rowData->setEntityId($data['id']);
        }
        $rowData->save();
        $this->messageManager->addSuccess(__('Row data has been successfully saved.'));
    } 
    catch (Exception $e) 
    {
        $this->messageManager->addError(__($e->getMessage()));
    }
    $this->_redirect('*/*/index');

    return $this->resultRedirectFactory->create()->setPath(
        '*/*/upload', ['_secure'=>$this->getRequest()->isSecure()]
    );
}

/**
 * Check Category Map permission.
 *
 * @return bool
 */
protected function _isAllowed()
{
    return $this->_authorization->isAllowed('Vendor_Module::Module_list');
}

}

之后，您要在phtml中为结果调用它。.so下面的代码写入phtml文件中。
这是代码。

    $collection = $block->getCollectionFor();
    $_objectManager = \Magento\Framework\App\ObjectManager::getInstance(); //instance of\Magento\Framework\App\ObjectManager
    $storeManager = $_objectManager->get('Magento\Store\Model\StoreManagerInterface'); 
    $currentStore = $storeManager->getStore();
//Base URL for saving image into database.
    $mediaUrl = $currentStore->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);

getCollectionFor（）写在我的block.so中，因此，您应该将其用作阻止文件。
希望对您有帮助。如果您有任何疑问，请告诉我。

我检查了代码，发现未包含从目录获取图像URL的代码。您必须对其进行处理才能解决此问题。缺少包含图像URL的代码。

看来这是Magento 2.1中的一个已知问题。这是指向其github的链接，以获取有关该主题的更多信息。 https://github.com/magento/magento2/issues/6138 似乎可能有一些不同的修复方法可以尝试。

您可以查看上一次提交并在github上为其创建路径，然后尝试应用它 https://github.com/magento/magento2/commit/ba6612462c260da7cc534b6365623993a6fe4311

通过使用jquery，我们可以将图像保存到文件夹中。

在脚本中，编写此代码

<script>
    function file_up(id)
    {
        var up_id = 'uploadfiles'+id;
        var upremv_id = 'upload'+id;
        var files = document.getElementById(up_id).files;
        for (var i = 0; i < files.length; i++)
        {
            uploadFile(files[i],up_id,upremv_id);
        }
    }
    function uploadFile(file,up_id,upremv_id){
        var url = "<?php echo $baseurl ?>helloworld/index/upload";
        var xhr = new XMLHttpRequest();
        var fd = new FormData();
        xhr.open("POST", url, true);
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) {
                jQuery('#imgna'+up_id).val(xhr.responseText);
                console.log(xhr.responseText); // handle response.
                jQuery('#'+up_id).remove();
                jQuery('#'+upremv_id).remove();
                var img_va = '<img class="image" src="<?php echo $mediaUrl.'custom/'?>'+xhr.responseText+'">';
                jQuery('#pre'+up_id).html(img_va);
            }
        };
        fd.append('uploaded_file', file);

</script>

然后，在您的自定义控制器中：

类上传扩展了\ Magento \ Framework \ App \ Action \ Action {

public function __construct(\Magento\Framework\App\Action\Context $context)
{
    parent::__construct($context);
}

public function execute()
{
    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();

    $fileSystem = $objectManager->create('\Magento\Framework\Filesystem');
    $mediaPath = $fileSystem->getDirectoryRead(\Magento\Framework\App\Filesystem\DirectoryList::MEDIA)->getAbsolutePath();
    $media = $mediaPath . 'custom/';

    //  exit;


    $file_name = rand() . $_FILES['uploaded_file']['name'];
    $file_size = $_FILES['uploaded_file']['size'];
    $file_tmp = $_FILES['uploaded_file']['tmp_name'];
    $file_type = $_FILES['uploaded_file']['type'];

    if (move_uploaded_file($file_tmp, $media . $file_name)) {
        echo $file_name;
    } else {
        echo "File was not uploaded";
    }
}

}

请参阅如何将图像上传保存到magento2中的文件夹？

并且通过使用观察者，您可以获取帖子中的图像值。在输入字段标签中，使用data-form-part =“ product_form”。