10

我目前正在尝试在我的 NodeJS + React App 中实现 Auth0。尽管我有一个大问题，但给出的这个教程真的很好而且很有帮助。每次我尝试通过 Auth0 登录/注册时，我都会得到

XMLHttpRequest 无法加载 https://XYZ.eu.auth0.com/usernamepassword/login。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问源“ http://localhost:3000 ”。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问源“ http://localhost:3000 ”。

所以我大致了解这意味着什么。但我只是不知道在哪里设置允许这个请求到 Auth0 所需的选项。在服务器端？在浏览器代码中？

最好的祝福

编辑：正如 Rodrigo López Dato 指出的那样，我可以在我的应用程序中编写 Origins：https ://manage.auth0.com/#/applications

我在本地开发时应该放什么？我的IP？

4

3 回答 3

10

如果您在本地开发，您可以放置​​您要重定向到的 URL。例如，如果您在 localhost 的 4000 端口上运行，并且您想重定向到名为 的路由/callback，您可以输入：

http://localhost:4000/callback

在那个领域。

于 2015-12-28T15:09:45.443 回答
7

Auth0 需要知道您的应用程序允许的来源和回调 URL 是什么。您可以在仪表板的应用程序设置中进行配置：https ://manage.auth0.com/#/applications

于 2015-12-28T14:31:08.810 回答
1

只是为了详细说明服务器端，因为您提到您正在构建一个 node.js 应用程序。我假设您也在使用 express。要处理 CORS 请求，您可以执行以下操作：

在您的快速服务器文件中，您可以将本地主机设置为客户端 React 应用程序以外的其他内容，该应用程序很可能在 localhost:3000 上运行。

var port = normalizePort(process.env.PORT || '5000');
app.set('port', port);

然后安装 cors npm 包并在你的 main express 文件中初始化它。

var app = express();
app.use(cors());

然后你所要做的就是在你的客户端 React package.json 文件中设置一个代理。

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

然后，您可以同时运行您的 node.js/express 服务器和 React 应用程序，并使用您的 express 服务器通过客户端 React 和代理发出请求。

希望这会有所帮助。

于 2018-08-12T22:09:49.857 回答