Der Pfad setupProxy.js wird in der Reactjs-Anwendung mit http-Proxy-Middleware nicht erkannt

Question

Ich implementiere die http-Proxy-Middleware in meiner Reaktions-App. Die Pfade von setupProxy.js werden nicht erkannt. Unten ist mein Code, bitte lassen Sie mich wissen, wenn ich etwas falsch mache.

App-Komponente

class App extends React.Component {
  test = () => {
// I dont have any thing which is running in "/api"  
// Simply called fetch with "/api" because setupPorxy.js  is looking my request or not 
    fetch("/api")
      .then(res => {
        alert('test pri')
        console.log('res', res)
      })
  }
  render() {
    return (
      <div className="App">
        <button onClick={this.test}>Test</button>
      </div>
    );
  }
}

setupProxy.js

const { createProxyMiddleware } = require('http-proxy-middleware');

\\ I dont have any thing running on localhost 5000 , want to check the request is modified or not 

module.exports = (app) => {
    app.use(createProxyMiddleware('/api', { target: 'http://localhost:5000', changeOrigin: true }));
}

Ausgabe

But ended with 404 not found in browser console like http://localhost:3000/api (404 not found)

Als ich die Anwendung startete, wurden die folgenden Protokolle angezeigt, die das Ziel jedoch nicht ersetzten

Answer 1

Mit Ihrem Code kann ich sehen, dass Sie die Create-React-App verwendet haben. Sie haben Ihre package.json nicht angezeigt. Haben Sie einen Proxy hinzugefügt? Ich denke, Sie haben es vielleicht verpasst.

package.json

{
   ....
   "proxy": "http://localhost:5000",
 }