混淆电子邮件地址和密码设计导轨？

Question

使用设计进行身份验证，

我想混淆用户信息（例如用户名和密码），当请求来自客户端时，

<%= bootstrap_form_for(resource, as: resource_name, url: session_path(resource_name, service: params[:service]), html: { class: 'm-t' }) do |f| %>

  <%= devise_error_messages! %>

  <%= f.email_field :name, required: true, hide_label: true, placeholder: 'Name' %>
  <%= f.password_field :password, required: true, hide_label: true, placeholder: 'Password'%>

  <%= f.submit "Sign In", class: 'btn btn-primary btn-block dark-button-text' %>

<% end %>

请求主体中的名称和密码可见，应该加密，我正在尝试使用JavaScript，

  $(document).ready(function() {
    $('form#new_user').submit(function() {
      let userPassword = $('#user_password')
      let userName = $('#user_name')
      userPassword.val(window.btoa(userPassword.val()))
      userName.val(window.btoa(userName.val()))
    })
  })

但是浏览器上的此更新值。

在应用程序中，如何解密与设计会话控制器相同的是对传入请求进行消毒。