React与API之间的通信

huangapple go评论113阅读模式
英文:

Communication between react and api

问题

一切都好吗?
我创建了一个与Rails API通信的React应用程序。
这是一个非常简单的应用程序,但React和API之间存在通信。

我的问题是…
我需要创建一个身份验证令牌,以防第三方使用我的API吗?还是我可以以某种方式告诉我的API,它只会响应来自我的网站的请求?

谢谢你的帮助!

英文:

Everything ok?
I created a react application that communicates with a rails api.
It is a very simple application, but there is this communication between react and api.

My question is…
Do I need to create a token of authentication so that third parties do not use my api? Or can I somehow tell my api that it only responds to requests that come from my site?

Thank you for your help!

答案1

得分: 0

  1. 好的,让我来帮你。我希望你可以创建一个类似这样的 URL 的服务器:'localhost:3000/api/' 或 'https://something.api/api'。你可以在React中使用Axios方法来使用这个API,例如:axios.get("localhost:3000/api/")

  2. 看起来你想在有人调用你的API时创建一个认证令牌。因此,有几个散列库可用于根据时间、用户名等创建API令牌。你可以创建它并保存到你的数据库中。每当像这样的API调用 'https://something.api/api/key=hfudjuh8989' 时,你可以从参数中获取密钥,并用它来与你的数据库进行验证。

英文:
  1. Okay let me help you with that. I hope you could create a sever with a URL like this: 'localhost:3000/api/' or 'https://something.api/api'. You can use this API in React by using Axios methods like: axios.get("localhost:3000/api/").

  2. It seems like you want to create a authentication token when someone calling your API. Hence there are several hash libraries are available for creating API tokens according to time, username, etc. You can create it save it to your database. Whenever API call like this 'https://something.api/api/key=hfudjuh8989' you can get the key as from params<!-- ? --> and use it to verify with your database.

答案2

得分: 0

谢谢那些给我提供了答案的人。

我刚从工作回来,坐下来学习了一会儿,然后发现了CORS。这正是我一直在寻找的内容。

这里有一个关于在Rails中使用的特定宝石的指南。
https://www.stackhawk.com/blog/rails-cors-guide/

----- 编辑

按照要求... 这是我的解决方案。

  1. 我安装了宝石 "rack-cors"。

  2. 在config/initializers目录下,我创建了一个名为cors.rb的文件,其中包含以下代码:

Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins "localhost:3000" #1
    resource "*", #2
      headers: :any,
      methods: [:get] #3
  end
end

#1 -> origins: 是你希望接受连接到API的来源,例如,在开发环境中,你应该放置 "localhost:3000" 或 "127.0.0.1:3000"。非常重要的是要包括域名和端口,否则会出错。

#2 -> resources: 是指定域名可以访问的资源。在这个例子中,是 * 表示所有资源,但你也可以设置为 "/orders" 或 "/users" 等,甚至可以为每个资源说明要接受的标头或方法。

#3 -> method: 是要接受的HTTP方法,如:get、post、put等。

英文:

thank you both that give me some answers.

I came from work now, and sit to study a little, and I found about CORS. That is exactly what I was looking for.

Here is a guide specific about a gem that make it in Rails.
https://www.stackhawk.com/blog/rails-cors-guide/

----- edit

As requested... here is my solution.

  1. I installed the gem "rack-cors".

  2. In config/initializers I created the file cors.rb with the following code:

Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins &quot;localhost:3000&quot; #1
    resource &quot;*&quot;, #2
      headers: :any,
      methods: [:get] #3
  end
end

#1 -> origins: are the origins that u want to accept connect to the api, in dev environment for example, u should place "localhost:3000" or "127.0.0.1:3000". Very important here!! domain + port, or u will get error.

#2 -> resources: are the resources that the specified domain may access. In example is * for all resources, but u could set just "/orders" or "/users". and even explain for each resource which header or methods u will accept.

#3 -> method: are the http methods that will accept, as: get, post, put etc

huangapple
  • 本文由 发表于 2023年6月12日 23:20:01
  • 转载请务必保留本文链接:https://go.coder-hub.com/76458074.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定