Companion connection with react

Uppy
1

Hi, i’m trying to test companion connection with a Reactjs application but i can’t make it work properly. When i try to connect with google i receive this error.

image
image2840×1210 177 KB

Backend companion options:

const companionOptions = {
  providerOptions: {
    drive: {
      key: GOOGLE_DRIVE_KEY,
      secret: GOOGLE_DRIVE_SECRET,
    },
  },
  server: {
    host: `localhost:${PORT}`,
    protocol: "http",
  },
  filePath: FILE_PATH,
  debug: true,
  secret: "realsecret",
  uploadUrls: `http://localhost:${PORT}`,
};

Frontend configuration:

import Uppy from "@uppy/core";
import GoogleDrive from "@uppy/google-drive";
import { Dashboard } from "@uppy/react";

import "@uppy/core/dist/style.min.css";
import "@uppy/dashboard/dist/style.min.css";

export const CustomDashboard = () => {
  const uppy = new Uppy({
    onBeforeFileAdded: (currentFile, files) => {
      console.log({ currentFile, files });
    },
    onBeforeUpload: (files) => {
      console.log("beofre upload", { files });
    },
  });
  uppy.use(GoogleDrive, { companionUrl: "http://localhost:3030" });

  return (
    <Dashboard
      showProgressDetails={true}
      uppy={uppy}
      plugins={["GoogleDrive"]}
    />
  );
};
2

Uff this will help me too, Please ¨support¨ help us

3

Hi, you are not initializing Uppy correctly in React.

Please checkout the docs React | Uppy