net::ERR_CONNECTION_REFUSED
フロントエンド(Reactアプリケーション)がバックエンド(あなたのSpring起動アプリケーション)に接続できない場合、通常はエラーがスローされます。
- あなたのバックエンド・アプリケーションがファイアウォールのいくつかの種類があり、あなたのバックエンドアプリケーションへのパスが
- を修正されていない
- を実行していない次のようなこれを実現するための多くの理由がありますが、あなたのケースでは、トラフィック
- を停止して、あなたのフロントとバックエンドアプリケーション...
の間で正常に動作していなかったバックエンドアプリケーションであるように思われました。
2番目の問題はCORSに関連しています。これは、JavaScriptが同じ(サブ)ドメインとポートにない他のAPI/Webサイトに接続できないようにするメカニズムです。あなたのフロントエンドはバックエンドとは異なるポートで動作しているので、CORSに対処する必要があります。
CORSを処理するには、バックエンドにヘッダーを追加する必要があります(つまり、Access-Contol-Allow-Origin
ヘッダーにエラーが表示されます)。春では、あなたのコントローラに以下の注釈を追加していることを行うことができます。
@CrossOrigin(origins = "http://localhost:3000")
それとも、フィルターやWebMvcConfigurer
を使用してグローバルCORSを設定することができます:@でのコメントで述べたように
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurerAdapter() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/api/**").allowedOrigins("http://localhost:3000");
}
};
}
をLutzホーン、これはSpring guideにも記載されています。
郵便配達員または可能性の高い投稿アプリでリクエストを送信しようとしましたか?その他のケースでは、バックエンドはクロスオリジン要求を受け入れますか? – Tugrul
ブラウザでhttp:// localhost:8080/api/path?p = testを試してください。それは動作しますか? –
接続が拒否されたということは、何らかの理由でバックエンドと通信できないということを意味します。バックエンドが実行されている場合は、パスが正しいかどうかを確認してください。私たちは今私たちが持っている情報でこの問題を解決することはできません。 – g00glen00b