使用 Rails Ranger 在 JavaScript 客户端中访问 Rails API

Rails Ranger是一个我写的图书馆,专注于利用Ruby on Rails API的默认功能来为他们编写JavaScript客户端,使你的生活更容易。

安装

1$ yarn add rails-ranger
2
3# or
4$ npm install —-save rails-ranger

基本设置

最基本的设置将是这样的东西:

1[label api-client.js]
2import RailsRanger from 'rails-ranger'
3
4const config = {
5  axios: { baseURL: 'http://api.myapp.com' }
6}
7
8export default new RailsRanger(config)

这里的一个重要注意事项是,您在 axios 选项中发送的任何内容都将以现状传递给 Axios,因此您可以随心所欲配置。

使用

那么,我们如何开始提出请求呢?如下:

1[label some-front-end-component.js]
2import api from 'api-client'
3
4api.list('users').then((response) => {
5  // your code
6})

所以,让我们把这里发生的事情分解下来:

我们导入了我们在配置部分中看到的以前的文件中设置的客户端 2。我们从中调用了列表函数,这只是索引的代名词。这将触发一个请求到http://api.myapp.com/usersURL 3。我们在response.data中接收的JSON将自动转换为蛇案

此外,您可以使用嵌套的资源,用这样的东西:

1api.resource(users, 1)
2   .list('blogPosts', { hideDrafts: true })
3   .then((response) => {
4  // your code
5})

这将是一个请求:

1http://api.myapp.com/users/1/blog_posts&hide_drafts=true

请注意,Rails Ranger 已将您的资源和参数从骆驼箱转换为蛇箱,因此您的应用程序(客户端和 API)的每个部分都可以以其偏好的标准进行交谈。

大家都很开心!!

奖金:使用Rails Ranger作为道路建设者

您还可以使用 Rails Ranger 作为路径构建器,并与您最喜欢的客户端自行处理请求:

1import { RouteBuilder } from RailsRanger
2const routes = new RouteBuilder
3
4route = routes.create('users', { name: 'John' })
5// => { path: '/users', params: { name: 'John' }, method: 'post' }

将 AJAX 请求发送到 Ruby on Rails API 可以很有趣,如果我们利用框架的既定标准。

通过这种方式,我们可以摆脱处理重复性的任务,例如在骆驼案和蛇案之间进行转换,并以语义的方式专注于访问终端。

使用 Rails Ranger 在 JavaScript 客户端中访问 Rails API

安装

基本设置

使用

更多特征

奖金:使用Rails Ranger作为道路建设者