Rails 5/6获取完整当前URL的方法咨询

好问题！首先得明确一个关键知识点：URL里的锚点（#后面的部分）是浏览器端专属的内容，不会随着HTTP请求发送到服务器。这就是为什么你用request.fullpath这类Rails后端方法拿不到它的原因——后端从始至终都没收到这部分数据。

要获取和用户访问时完全一致的完整URL，必须通过前端+后端配合的方式实现，下面是几种可行的方案：

方案1：表单提交时携带锚点信息 #

如果是通过表单提交页面数据，可以在表单中添加一个隐藏字段，用JavaScript把锚点值填充进去，提交后后端就能拿到这部分内容。

示例代码： #

<%= form_with url: books_path, method: :get do |form| %>
  <!-- 隐藏字段用于存储锚点 -->
  <%= form.hidden_field :fragment, id: 'url_fragment' %>
  <%= form.submit "提交" %>
<% end %>

<script>
  // 页面加载时，把当前URL的锚点赋值给隐藏字段
  document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('url_fragment').value = window.location.hash;
  });
</script>

后端获取完整URL的方式：

# 拼接基础URL、路径和锚点
full_url = "#{request.base_url}#{request.fullpath}#{params[:fragment]}"

方案2：AJAX请求直接传递完整URL #

如果是通过AJAX和后端交互，可以直接用JavaScript的window.location.href拿到包含锚点的完整URL，然后作为参数传给后端。

示例代码： #

// 发起POST请求
fetch('/api/save_url', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]').content
  },
  body: JSON.stringify({
    full_url: window.location.href
  })
})
.then(response => response.json())
.then(data => console.log('保存成功'));

后端直接获取完整URL：

# 直接从参数中拿到完整URL
user_accessed_url = params[:full_url]

方案3：通过Cookie存储锚点（适合后续请求） #

如果需要在用户后续的请求中获取当前页面的锚点，可以用JavaScript把锚点存入Cookie，后端再读取Cookie的值。

示例代码： #

// 页面加载时设置Cookie
document.addEventListener('DOMContentLoaded', function() {
  document.cookie = `url_fragment=${window.location.hash}; path=/`;
});

后端读取Cookie并拼接完整URL：

fragment = cookies[:url_fragment]
full_url = "#{request.base_url}#{request.fullpath}#{fragment}"

重要提示 #

• 锚点是浏览器端解析的，所以不可能在后端渲染页面时直接获取到锚点——因为后端生成页面内容时，浏览器还没加载页面，锚点还不存在。
• 所有方案都依赖前端把锚点信息主动传递给后端，这是唯一可行的路径。

内容的提问来源于stack exchange，提问作者user12073145