1

I want to upload images using graphql, can anyone tell me how can I implement this?

Let me know if anyone has any idea.

3 Answers 3

2

First convert your image into base64 then use that base64 string in to graphql input.

<?php

namespace VendoreName\ModuleName\Model\Resolver;

use Magento\Framework\GraphQl\Config\Element\Field;
use Magento\Framework\GraphQl\Exception\GraphQlInputException;
use Magento\Framework\GraphQl\Query\ResolverInterface;
use Magento\Framework\GraphQl\Schema\Type\ResolveInfo;
use Magento\Framework\App\Filesystem\DirectoryList;
use Magento\Framework\Filesystem;
use Magento\Framework\Filesystem\Driver\File;

class UploadImage implements ResolverInterface
{
    public function __construct(
        ....................................
        Filesystem $fileSystem,
        File $fileDriver,
        ....................................
    ) {
        ....................................
        $this->fileSystem = $fileSystem;
        $this->fileDriver = $fileDriver;
        ....................................
    }
    public function resolve(
        Field $field,
        $context,
        ResolveInfo $info,
        array $value = null,
        array $args = null
    ) {
        //your logic
        $this->uploadFile($fileData);
        //your logic
    }

    public function uploadFile($fileData)
    {
        // convert base64 string to image and save as file on server.
        $uploadedFileName = "";
        $fileName = '';
        if (isset($fileData['name'])) {
            $fileName = $fileData['name'];
        } else {
            $fileName = rand() . time();
        }
        if (isset($fileData['filecontent'])) {
            $mediaPath = $this->fileSystem->getDirectoryRead(DirectoryList::MEDIA)->getAbsolutePath();
            $originalPath = 'ModuleName/Attachments/';
            $mediaFullPath = $mediaPath . $originalPath;
            if (!file_exists($mediaFullPath)) {
                mkdir($mediaFullPath, 0775, true);
            }
            /* Check File is exist or not */
            $fullFilepath = $mediaFullPath . $fileName;
            if ($this->fileDriver->isExists($fullFilepath)) {
                $fileName = rand() . time() . $fileName;
            }
            $fileContent = base64_decode($fileData['filecontent']);
            $savedFile = fopen($mediaFullPath . $fileName, "wb");
            fwrite($savedFile, $fileContent);
            fclose($savedFile);
            $uploadedFileName = "/" . $fileName ;
        }
        return $uploadedFileName;
    }
}

Here $fileData is array and with $fileData['filecontent'] = base64 string of file and $fileData['name'] = file name.

2
  • Thanks for your answer, how can I add conditions to upload only these 'jpg', 'jpeg', 'gif', 'png','JPEG' images Commented Jan 4, 2022 at 5:43
  • For check file extensions click here edureka.co/community/92445/… Commented Jan 4, 2022 at 5:50
2

Please check the below link and see if it helps:

https://github.com/huykon/magento-graphql-uploader

0

There are two easy steps to achieve this

  • Client Side (in browser or mobile application): Convert your image into base64 on client side then use that base64 string in to graphql input.
  • Server Side: Convert base64 string to image and save as file on server.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.