<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: tongesy</title>
    <description>The latest articles on DEV Community by tongesy (@tongesy).</description>
    <link>https://dev.to/tongesy</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F659596%2F26a2cd27-c5aa-44ae-95a5-79c0bd5bdbd7.png</url>
      <title>DEV Community: tongesy</title>
      <link>https://dev.to/tongesy</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/tongesy"/>
    <language>en</language>
    <item>
      <title>Uploading a binary file buffer to Strapi using a custom Strapi Service</title>
      <dc:creator>tongesy</dc:creator>
      <pubDate>Thu, 01 Jul 2021 07:00:56 +0000</pubDate>
      <link>https://dev.to/tongesy/uploading-a-binary-file-buffer-to-strapi-using-a-custom-strapi-service-4plh</link>
      <guid>https://dev.to/tongesy/uploading-a-binary-file-buffer-to-strapi-using-a-custom-strapi-service-4plh</guid>
      <description>&lt;p&gt;I'm working on a personal project that generates a web page screenshot (using Puppeteer) when a Strapi endpoint gets called.&lt;/p&gt;

&lt;p&gt;After digging in the Strapi docs and archives, Stack Overflow, and deep in Google Search, I came up with only a couple of small leads.&lt;/p&gt;

&lt;p&gt;Writing a Service in Strapi to handle the upload was the path I wanted to take; however, Strapi's documentation wasn't clear on using strapi.plugins.upload.services.upload.upload().&lt;/p&gt;

&lt;p&gt;Based on what I could see, uploading a file to Strapi was primarily done by calling the upload endpoint. E.g. a file would be uploaded on the front end and sent via the endpoint to Strapi. I needed to upload a file generated on the server and use the upload Service within a Strapi Service.&lt;/p&gt;

&lt;p&gt;When I tried using the Strapi upload Service directly with the binary buffer generated on the server, I ran into issues due to it expecting a file path that it can then read into a buffer:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;readBuffer = await util.promisify(fs.readFile)(file.path);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This issue is resolved by skipping this step with a custom Service and providing Strapi with the binary buffer directly.&lt;/p&gt;

&lt;p&gt;Here's the code that worked for me:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;uploadFileBinary: async (binary, uuid) =&amp;gt; {
    const fileInfo = { name : uuid }
    const metas = {}
    const { optimize } = strapi.plugins.upload.services['image-manipulation'];
    const { buffer, info } = await optimize(binary);
    const formattedFile = await strapi.plugins.upload.services.upload.formatFileInfo(
      {
        filename: uuid + '.png',
        type: 'image/png',
        size: binary.toString().length,
      },
      fileInfo,
      metas
    );
    const fileData = _.assign(formattedFile, info, {
      buffer,
    });
    const upload = await strapi.plugins.upload.services.upload.uploadFileAndPersist(fileData)
    return upload.id
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Once implemented, I was able to call the endpoint and create the screenshot .png using Puppeteer and then provide the generated binary buffer to my custom uploadFileBinary Service to insert into Strapi's media library.&lt;/p&gt;

&lt;p&gt;Success!&lt;/p&gt;

</description>
      <category>strapi</category>
    </item>
  </channel>
</rss>
