frankcollins3 / fill_container

codecamp team project updated with new icon screen menu + puppeteer icon search, GraphQL, redux, relational psql !mongo, and accuweatherAPI
1 stars 0 forks source link

proxy route not working [5:49pm] #243

Closed frankcollins3 closed 1 year ago

frankcollins3 commented 1 year ago

attempting to do:

242 during the solving of this issue: I was calling API incorrectly.

chatGPT led me down a waterhole of using a serverProxy route that looks like this:

app.get('isItRaining', async (req, res) => {
  try {
    const response = await axios.get('http://dataservice.accuweather.com/locations/v1/{keythatworksInNavbar.tsxTest}?apikey=%09CG0C6JlnXhBUOi4R9JlJILWZGyBP6LkD');
    res.json(response);
  } catch (error) {
    // res.status(500).json({ error: 'Internal server error' });
    res.json( { error: 'see the error of your ways' })
  }
});

error: Screen Shot 2023-06-21 at 5 52 21 PM

proposed approach: const serverProxyTest = await axios.get(http://localhost:5000/isItRaining)

// separate concerns (${API} works) and do a barebones hitting of route with hard defined server path "host:5000"

frankcollins3 commented 1 year ago

👎 axios.get('isItRaining') got excited to find solution without chat and this doesn't work surprisingly. It defaults to calling the URL from the frontend url which is (in dev mode) currently :host/3000 [6:00pm]

frankcollins3 commented 1 year ago

changed to pokeAPI and removed changeOrigin just see plain API fetch but with proxy: "/isItRaining'"

app.use('/isItRaining', createProxyMiddleware({
  target: 'http://pokeapi.co/api/v2/pokemon',
  // changeOrigin: true,
  // pathRewrite: {
  //   '^/isItRaining': 'http://dataservice.accuweather.com/locations/v1/CG0C6JlnXhBUOi4R9JlJILWZGyBP6LkD?apikey=CG0C6JlnXhBUOi4R9JlJILWZGyBP6LkD',
  // }
}))

[6:16pm]

👻👻👻👻👻👻👻👻👻👻👻👻👻 status === 200 data === null [6:19pm] 👻👻👻👻👻👻👻👻👻👻👻👻👻

[6:20pm]

frankcollins3 commented 1 year ago

🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳🏳

[6:56pm]

tapping out. Learned some about serverproxy even though I didn't successfully use it. also learned about webpack, and that it can prepare process.env for clientside at build time.

seeing so many jobs in so many places say: 'webpack', 'webpack', 'webpack', it makes so much more sense.

[6:58pm]

frankcollins3 commented 1 year ago

able to connect accuweatherAPI successfully. didn't need any such proxy approach