Rails performing XHR request when loading pages

Asked

Viewed 155 times

3

I have noticed that in every page/route exchange, the Rails *make a new request Ajax to search for this new data (HTML), and thus perform the page exchange. I did several searches but the closest I arrived was in relation to the Embedded Ruby (erb).

If this is really valid, I would like to know how and with what the Rails makes this exchange, and what are the options and advantages of using this type of resource, for example:

  • I have the availability of the two-way data binding also?
  • What resources are available?
  • I have other options?

Details

The question can be confusing so I decided to add some images that show what I really want to understand. Using a simple navigation bar with links (element a) for route change, as shown in figure 1.

inserir a descrição da imagem aqui

Figure 1: The navigation menu I used for the tests.

I can notice that Rails makes some requests to exchange these pages (such as Angularjs or vuejs), as shown in image 2.

inserir a descrição da imagem aqui

Figure 2: The results of page/route changes in the console tab.

We can also follow the tab network, as shown in Figure 3. inserir a descrição da imagem aqui

Figure 3: The results of page/route changes in the network tab.

Thank you.

2 answers

1


I think these requests that you are logging into your service are being carried out by Turbolinks(Added in version 4 of the framework), unfortunately it does not have Two Way databind, because its function is different. You can consult the available resources and other options on documentation of Turbolinks.

An overview of how it works:

The Turbolinks transform applications Rails in an application Javascript single-page; i.e., instead of loading new pages, replace the current page with new server content:

The functionality is similar to the pjax, but instead of worrying with which element to replace on the page and then customize the answer of the server according to the answer, we replace the whole body of the page. This results in most of the speed obtained using pjax (without recompiling Javascript or CSS), avoiding customize the server responses.

  • 1

    Excellent! As I’m following a book to learn Rails, I couldn’t identify this feature, which, it was very clear after your reply and the images that I added the question myself. Thank you, have a good development day.

  • @Rafaelberro really, after placing the images I was able to identify what was really happening. Good development.

0

Ruby on Rails is a framework for the backend and is therefore not a single-page application framework (for frontend) like Angularjs and React. When you require a server route (request), it sends a response (Response), which is a new page with the route-related template you requested. (Note: If it is an API, the server sends a JSON response instead of HTML).

Routes are configured in config/routes.rb and templates are chosen based on actions in the controller (app/controllers/) which is associated with the route. Side note: A lot of things are done for you Behind the Scenes with Rails, so if you want to understand the routes and templates business more, I suggest you use the Sinatra, which is a web framework similar to Rails, although much more light and requires you to make your own routes and send the templates manually.

I think you’re confusing the frontend with the backend. Usually the two are separated and Rails only serves as a backend that sends information via JSON. There on the frontend, using a framework like Angular, you make requests to the backend to get the information via JSON, which you put into the DOM. It’s on the frontend that you can do two-way Binding data (with Angular) or one-way (with React).

  • Thank you for sharing this information, but unfortunately that’s not the answer I’m looking for. I added some information and images in the question, if you take a look and manage to answer me again I thank you. Hugs.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.