Docs

React Views & Browser-Callable Services

How Vaadin protects React views and the browser-callable services that they call, and how their defaults differ from Flow views.

A React view runs in the browser. The user can read its code, and change what it does, with the developer tools of the browser. The data of the view comes from the browser-callable services that it calls, and the server checks every call to them. These checks are what protect the data.

Vaadin also checks access to React views, but only to decide what the user sees: which views the router opens, and which views the menu shows. These checks don’t protect anything that the browser has already loaded.

Default Access

Browser-callable services, React views, and Flow views have different defaults:

Without an access rule

Browser-callable service

Denied to everyone. See Service Access Control.

React view

Open to everyone. See View Access Control.

Flow view

Denied to everyone. See Annotation-Based Access Control.

A React view that you add to an application whose Flow views all require login is therefore open to everyone, until it or a layout around it requires login.

Spring Security Configuration

React views and Flow views share the Spring Security configuration that VaadinSecurityConfigurer applies, as described in Security Configuration. For React views and browser-callable services, the configurer does more:

  • It permits the requests for React views that don’t require login, and for service methods that allow anonymous access.

  • It requires a logged-in user for the other calls to services, and responds to them with 401 Unauthorized when nobody is logged in.

  • It checks the user when the browser loads the page of a React view that requires login, as described in Page Loads.

  • It configures the protection of service calls against cross-site request forgery, as described in Cross-Site Request Forgery.

Data in the Browser

A React view can keep the data that it gets from services in the browser, for example in local storage, so that the view also works offline. Whoever uses the browser later can read that data. Decide whether the data may stay in the browser, and remove the data that may not when the user logs out.

Topics

Service Access Control
The access annotations of browser-callable services, how Vaadin checks them, and how to audit the calls that it denies.
Authentication
The login view of React views, the user information that the browser gets, the authentication context, and expired sessions.
View Access Control
How Vaadin checks the access options of React views in the browser, in the menu, and on page loads.
Stateless Authentication
Keeping the authentication of the user in a signed JSON Web Token in the browser, instead of in the HTTP session, in applications with React views.

Updated –