错误：在 MERN 应用程序中集成 authorizenet

Question

我提供了我的 authorizenet Integration 的前端代码，在沙盒中它工作正常但是当涉及到生产模式时它抛出错误

{代码：“E00124”，文本：“提供的访问令牌无效”}

import { HostedForm } from "react-acceptjs";
import { toast } from "react-hot-toast";
import { authorizePayment } from "src/actions/PatientPaymentActions";
import { env } from "src/config";
import { useHistory } from "react-router-dom";
import { useState } from "react";

const authData = {
  apiLoginID: env.authorizeNetAPILoginId,
  clientKey: env.authorizeNetClientKey,
};

const AuthorizeCheckout = ({ patient, checkoutData }) => {
  const history = useHistory();
  const [transactionRes, setTransactionRes] = useState(null);
  console.log("log: checkout data", checkoutData);
  const handleSubmit = async (response) => {
    console.log("log: Received response:", response);
    response.customerInformation = {
      ...response?.customerInformation,
      patient,
      checkoutData: { ...checkoutData },
    };
    const res = await authorizePayment(response);
    if (!res || res?.error) {
      toast.error(res?.message ? res?.message : "Smothing went wrong!");
      history.push(`/payment/stripe/processing?patientId=${patient?.id}`);
    } else {
      console.log("log: success");
      toast.success(
        res?.data?.message ? res?.data?.message : "Payment success!"
      );
      setTransactionRes(
        res?.data?.requestPayment?.transactionResponse?.transId
      );
      history.push(`/payment/stripe/processing?patientId=${patient?.id}`);
    }
  };

  return (
    <HostedForm
      buttonStyle={{
        width: "100%",
        margin: "auto",
        padding: "8px 0",
        border: "none",
        backgroundColor: "#ffc107",
        fontSize: "18px",
        fontWeight: 600,
        borderRadius: "5px",
      }}
      environment="PRODUCTION"
      buttonText="Confirm Payment"
      authData={authData}
      onSubmit={handleSubmit}
      errorTextClassName="text-dang`your text`er"
    />
  );
};

export default AuthorizeCheckout;