我的应用程序在轨道上的后端红宝石中有反应，并在前端做出反应，在部署期间，在本地环境中进行了测试和发布请求（Rails API和Heroku和Heroku and Heroku and Heroku and React in vercel），我会得到下一个错误：
我在浏览器中使用插件（CORS到处），激活后，这就是结果：
所以，我想正确地管理cors以避免使用附加件，例如，这是负责Get请求的前端代码：
useEffect(() => {
const fetchMeals = async () => {
//const response = await fetch('https://movieserp-default-rtdb.firebaseio.com/meals.json');
const response = await fetch("https://rorletsorder.herokuapp.com/meals", {
method: 'GET',
});
if (!response.ok) {
throw new Error("something went wrong");
}
关于后端，CORS.RB负责处理CORS：
Rails.application.config.middleware.insert_before 0, Rack::Cors do
#allow do
# origins 'localhost:3005', '127.0.0.1:3005'
# resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head]
#end
allow do
origins 'https://reactletsorder.vercel.app/'
resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head]
end
end
如您所见，当我在本地测试时，我已经评论了这些行，并且一切正常运行良好，问题在于部署，我认为这足以包括前端URL，我的问题是：我需要在我的背部或前端更改什么才能正确管理和发布请求而不触发CORS警报？
多谢
my application has in the backend Ruby on Rails and React in the frontend, testing GET and POST Requests in local environment was successfully, during the deployment (Rails API and Heroku and React in Vercel) I'm getting the next error:
I'm using an addons (cors everywhere) in my browser, after activate it this is the result:
So, I would like to manage properly CORS to avoid the use of the addon, as an example this is the frontend code in charge of the GET Request:
useEffect(() => {
const fetchMeals = async () => {
//const response = await fetch('https://movieserp-default-rtdb.firebaseio.com/meals.json');
const response = await fetch("https://rorletsorder.herokuapp.com/meals", {
method: 'GET',
});
if (!response.ok) {
throw new Error("something went wrong");
}
About the backend, the cors.rb is in charge to handle CORS:
Rails.application.config.middleware.insert_before 0, Rack::Cors do
#allow do
# origins 'localhost:3005', '127.0.0.1:3005'
# resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head]
#end
allow do
origins 'https://reactletsorder.vercel.app/'
resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head]
end
end
As you can see, I have commented the lines when I tested on local and everything works well, the issue is in the deployment, I thought it was more than enough to include the frontend url, my question is: what do I need to change in my back or frontend to manage properly the GET and POST Request without triggering the CORS alert?
Thanks a lot
发布评论
评论（1）
直接从
因此，从
ORIGINS https://reaectletsorder.vercel.app/'删除后斜线Directly from the documentation of rack-cors: "When specifying an origin, make sure that it does not have a trailing slash."
So remove the trailing slash from
origins 'https://reactletsorder.vercel.app/'