Heim  >  Fragen und Antworten  >  Hauptteil

Testen der Verbindung zwischen meinem lokalen React-Frontend und dem Node.JS-Server

Ich habe einen node.JS Express-Server erstellt, der über die API JSON an mein Frontend sendet. Ich habe das Backend fertiggestellt und auf einen AWS-Server gestellt. Jetzt möchte ich nur noch am React-Frontend arbeiten. Ich beginne auf „localhost:3000“ zu reagieren und stelle eine Anfrage an den AWS-Server, erhalte jedoch eine CORS-Fehlermeldung, die mir mitteilt, dass „localhost:3000“ nicht berechtigt ist, Anfragen an diesen Server zu senden.

从源“http://localhost:3000”获取“http://www.myawssever.fr:4000/api-url/”的访问已被 CORS 策略阻止:无“访问控制” -Allow-Origin'标头存在于请求的资源上。如果不透明响应满足您的需求,请将请求模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

Ich habe mehrere Lösungen ausprobiert, um localhost:3000 zu autorisieren, aber ich glaube nicht, dass das Problem von dort kommt, denn für den Server ist localhost:3000 die Adresse selbst! Wissen Sie, wie ich meinen Rücken von meinem Computer aus testen kann (Reagieren auf localhost:3000), indem ich eine Anfrage an den Server (AWS) sende?

P粉327903045P粉327903045429 Tage vor549

Antworte allen(1)Ich werde antworten

  • P粉077701708

    P粉0777017082023-09-08 12:04:33

    以下是解决 CORS 错误并启用 React 前端与 AWS 服务器之间通信的组合步骤

    在您的 AWS 服务器上配置 CORS

    首先,您需要配置服务器以在响应中包含适当的CORS标头。您需要添加带有值“http://localhost:3000”“Access-Control-Allow-Origin”标头,以允许来自React应用程序的请求。< /p>

    配置CORS的具体方法

    配置 CORS 的确切方法取决于您使用的服务器技术(例如 Express、Apache、Nginx)。例如,如果您使用 Express,则可以使用 cors 中间件。以下是如何使用 Express 配置 CORS 的示例:

    const express = require('express');
    const cors = require('cors');
    
    const app = express();
    
    app.use(cors({ origin: 'http://localhost:3000' }));
    
    // Rest of your server code...
    
    app.listen(4000, () => {
      console.log('Server running on port 4000');
    });
    

    重新启动您的 AWS 服务器

    配置 CORS 后,重新启动 AWS 服务器以应用更改。

    Antwort
    0
  • StornierenAntwort