0

I am trying to create a small application that allows the user to return data from the GitHub API, I have a React application that gets its data from an express server.

When I call the express path from Postman the data is returned okay so I don't believe the call itself to be the issue.

app.js

app.post("/GHIssueBeautifier/issues", (req, res) => {
  const { repo } = req.body;
  dotenv.config();
  fetch(`https://api.github.com/repos/ORGNAME/${repo}/issues`, {
    headers: {
      Authorization: `token ${process.env.PERSONAL_ACCESS_TOKEN}`,
    },
    method: "GET"
  })
    .then((response) => response.json())
    .then((response) => {
      return res.status(200).json(response);
    })
    .catch((error) => {
      return res.status(400).json(error);
    });
});

I have used console.logs to check that the data is returned correctly and it looks like it is.

Home.js

const searchRepo = () => {
      const requestData = {
        repo: this.state.repo,
      };
      fetch(`${process.env.REACT_APP_API_URL}GHIssueBeautifier/issues`, {
        method: "POST",
        body: JSON.stringify(requestData)
      })
        .then((response) => { 
          response.json()
        })
        .then((data) => {
          data.forEach(element => {
            element.milestone_search = this.state.milestone
          });
          this.setState({ items: data });
        })
        .catch((error) => {
          console.log('Error', error);
        });
    };

This fetch always return the error:

Error returned

The network tools in Chrome show me that the request has been cancelled:

Chrome network tools

Any help is greatly appreciated.

scudderk
  • 41
  • 1
  • 4
  • You can check [this](https://stackoverflow.com/a/49895164/5566935) – Mohammad Abdul Alim May 11 '21 at 18:17
  • I think that `process.env.REACT_APP_API_URL` is `undefined`. Check that out! – Mattia Rasulo May 11 '21 at 18:25
  • @MohammadAbdulAlim This is how I am currently handling CORS, I am not sure if this is correct or how to even check if this code is working correctly. `app.use((req, res, next) => { res.header("Access-Control-Allow-Origin", "*"); next(); }); ` – scudderk May 11 '21 at 18:33
  • 1
    @MattiaRasulo I have double checked and this is not the case, thank you anyway though :) – scudderk May 11 '21 at 18:35

0 Answers0