How to use Entity Service API inside plugin

Questions and Answers Strapi Backend
1

I’m trying to perform CRUD operations with EntityService API inside my plugin.

I created a plugin using strapi generate command.

Then create an index.js file under /src/plugins/myplugin/admin/src/components/myapp/index.js with the below content

import React from "react";
import { Button } from "@strapi/design-system/Button";
import Refresh from "@strapi/icons/Refresh";
import { useCMEditViewDataManager } from "@strapi/helper-plugin";

export const Myapp = () => {
  const { modifiedData } = useCMEditViewDataManager();

  const handleConfirm = async (id) => {
    try {
      alert(id);
      const res = await strapi.entityService.findOne("api::show.show", id);
      console.log(res);
    } catch (error) {
      console.log(error);
    }
  };

  return (
    <>
      <Button
        variant="secondary"
        startIcon={<Refresh />}
        onClick={() => handleConfirm(modifiedData.id)}
      >
        Sync
      </Button>
    </>
  );
};

Then pointed this file in the root of the admin directory’s index.js file

  bootstrap(app) {
    app.injectContentManagerComponent("editView", "right-links", {
      name: "myapp",
      Component: Myapp,
    });
  },

This button is appearing as expected in the edit view right sidebar. But when I click on it, I’m getting the following error. So I can’t perform any action with Entity Service API

TypeError: Cannot read properties of undefined (reading 'findOne')
    at Sync (index.js?591e:12:31)
    at eval (index.js?8896:25:29)
    at Generator.next (<anonymous>)
    at eval (23853:36:61)
    at new Promise (<anonymous>)
    at __async (23853:20:10)
    at handleConfirm (index.js?8896:22:39)
    at onClick (index.js?8896:41:24)
    at handleClick (VM293 Button.js:76:7)
    at HTMLUnknownElement.callCallback (react-dom.development.js?61bb:3945:1)
1 Like
2

You can try the Axios instance that is exported from the plugin-name/admin/src/utils/axiosInstance.js, or use the request object in the @strapi/helper-plugin:

return await request('/todo/find',{
      method:'GET'
     })
1 Like
3

Hello I’m in the same situation. Could you explain a bit more your @strapi/helper-plugin solution @icahnchen ? I have the same needs.

A way I’d like to explore is to have a custom endpoint that does all the back-end processes and inside the handleConfirm just call that endpoint. However, that endpoint should be only for logged Strapi users. But I’m unsure how to get the Auth of the current user and add that to the request.

4

Answering myself here:

After thoroughly reading this blog tutorial I have understood that endpoints created inside a Strapi plugin are by default only accessible by an Admin authorized user. So if you use the endpoints created inside the plugin (./src/plugins/your-plugin/server → routes & controllers) you will be able to use any kind of strapi.entityService inside there.

And then call it on the /src/plugins/myplugin/admin/src/components/myapp/index.js file as @icahnchen was saying:

import axiosInstance from '../../utils/axiosInstance';
// or
import { request } from '@strapi/helper-plugin';

And then inside handleConfirm:

return await axiosInstance.get(`/report-button`);
// or
return await request('/todo/find',{method:'GET'})

Hope this helps!

5

Thanks for your answer, I have tried this but it got 401 unauthorized error. I want to query to the table in database which did not create inside my plugin. This content type places in path /src/api/article.

The function I called is:

await request('/api/articles', { method: 'GET' })

What should I do now :smiley:

6

For that, you should be able to retrieve this information with Strapi CRUD operations instead of directly requesting the API endpoint.