Am having issues with Axios and Forge via Forge UI Kits

Am working with Forge UI Kits for jira. Am trying to send data to server via Axios. When I run the code it displays error


Something went wrong
There was an error invoking the function - XMLHttpRequest is not defined

ReferenceError: XMLHttpRequest is not defined
    at dispatchXhrRequest (index.js:13394:19)
    at new Promise (<anonymous>)
    at xhrAdapter (index.js:13386:10)
    at dispatchRequest (index.js:31534:10)
    at async Object.onSubmita [as onSubmit] (index.js:13795:17)
    at async index.js:30340:13
    at async asyncMap (index.js:30322:24)
    at async index.js:30343:29
    at async asyncMap (index.js:30322:24)
    at async index.js:30343:29

This is the code


import api, { route } from "@forge/api";
import ForgeUI, { render, Fragment, Text, IssuePanel,Button, ButtonSet, useProductContext, useState, Component, useEffect, ConfigForm, Form, Option, Select, TextArea, TextField,UserPicker, RadioGroup, Radio} from "@forge/ui";

import axios from 'axios';


const App = () => {

const [formState, setFormState] = useState(undefined);

 const onSubmita = async (formData) => {
	 
	 
    const payload = { name: 'John Doe', title: 'gardener'};
    const res = await axios.post('https://mysite.com/db/airmeal.php', payload);

    const data = res.data;
    console.log(data);
	
      
	 

 setFormState(formData);
  };
	 onSubmita().then(() => console.log('success'));

I don’t think you can use Axios in Forge, as a lot of the native Node modules are blocked. In order to do requests, you need to use the Fetch API exposed by forge: https://developer.atlassian.com/platform/forge/runtime-reference/fetch-api/

For more context: https://developer.atlassian.com/platform/forge/runtime-reference/

The following Node.js built-in modules are not supported:
async_hooks, child_process, cluster, constants, dgram, dns, domain, http2,
module, net, perf_hooks, readline, repl, sys, tls, trace_events, tty, v8,
vm, worker_threads.
4 Likes