使用 Reactjs、Ckeditor4、Firebase 上传图片？

Question

我是前端的初学者/不知道后端/。我只是想为了好玩而创建博客。 Reactjs、Ckeditor4 和 Firebase 工作正常，但唯一的问题是我无法将图像上传到我的 ckeditor4-react。也不知道接下来会出现什么问题。 ckeditor4-react 工作正常，除了图片上传。请帮帮我。

import Ckeditor4React from "ckeditor4-react";

const Ckeditor = (props) => {
  return (
    <div className="container">
      <Ckeditor4React
        data="<p>It is CKEditor</p>"
        config={{
          uiColor: "#AADC6E",
          extraPlugins: "uploadimage",
          uploadUrl: "/uploader/upload",
          filebrowserUploadMethod: "form",
          filebrowserBrowseUrl: "1",
          filebrowserUploadUrl: "2",
          filebrowserImageBrowseUrl: "3",
        }}
      />
      <button className="btn btn-primary">Submit</button>
    </div>
  );
};

我的 App.js

function App() {
  return (
    <BrowserRouter>
      <Router history={history}>
        <div className="App">
          <Switch>
            <Route path="/" exact component={HomePage} />
            <Route path="/ckeditor" exact component={Ckeditor} />
            <Route path="/uploader/upload" exact component={CkeDragdrop} />
          </Switch>
        </div>
      </Router>
    </BrowserRouter>
  );
}

上传.js

import React, { useEffect } from "react";
import axios from "axios";

const CkeDragdrop = () => {
  useEffect(() => {
    console.log("testing1");

    axios
      .post("https://reqres.in/api/register", {
        email: "eve.holt@reqres.in",
        password: "pistol",
      })
      .then((response) => {
        console.log("testing2");
        console.log(response);
      })
      .catch((error) => {
        console.log(error);
      });
  }, []);

  return <div>testing3</div>;
};

export default CkeDragdrop;

Answer 1

<CKEditor
    data="<p>Hello from CKEditor 4!</p>"
    config={{   
        filebrowserUploadMethod  : "form",
        uiColor: "#AADC6E",
        extraPlugins: "uploadimage",
        filebrowserUploadMethod: "form",
        filebrowserUploadUrl :("/uploader/upload"),      
    }}
/>