使用 AJAX 和 jQuery 验证 From 而不将数据发送到另一个文件

Posted 2023-05-09

【中文标题】使用 AJAX 和 jQuery 验证 From 而不将数据发送到另一个文件

【英文标题】：Validating From using AJAX and jQuery without sending data to another file

【发布时间】：2019-08-16 20:14:55

【问题描述】：

我的问题是 - 现在 - 不是关于特定代码，而是更多关于基本理解 - 我认为。

我想创建一个公式并在不刷新页面的情况下使用数据，所以这让我想到了 AJAX。

现在我是否总是需要创建一个单独的文件来处理 AJAX 发送的数据？我不能只是“抓取”数据并在同一页面上使用它吗？

我想我误解了一些基本概念。

我想过这样的事情：

<form id="load_filters_form">
  ..
</form>

<?php
  var_dump($_GET); // values from <form>
?>

<!-- AJAX, jQuery -->
<script>
  $("#load_filters_form").submit(function(event)

    event.preventDefault();

    $.ajax(

      type: 'get',
      data: $(this).serialize()
      success: function() 
        $("#load_filters_form")[0].reset(); 
      

    );

  );
</script>

【问题讨论】：

我不太清楚你在问什么。您可以以任何您喜欢的方式使用您的数据。究竟是什么不工作？如果您的验证逻辑在此页面上，那么您可以使用该逻辑而无需发出 AJAX 请求。 （注意：您不应隐式信任 任何 客户端验证，并且仍应在提交对此数据的任何操作之前验证服务器端。）

我试图实现的是我不必重新加载页面，但仍然有数据。通常我会将表单发送到同一页面，但这也会重新加载它，对吧？

如果您使用 AJAX，则不会重新加载当前可见页面。 AJAX 只是在后台（在代码中）向服务器发出请求，并在代码中处理响应。我建议您查看一些有关 AJAX 的示例和教程，以明确了解它的作用。

是的，我想在同一页面上处理结果。这不可能吗？

【参考方案1】：

您的提议当然是可能的，这正是 AJAX 的工作原理。您从 javascript 代码发出 AJAX 请求，发送服务器端代码需要的任何数据，并在 JavaScript 代码中处理来自服务器的响应。

你所提议的问题在于你让自己变得不必要的复杂。考虑问题中的代码将返回到 AJAX 响应中的 JavaScript 代码的内容。它返回整个 html 页面，其中大部分已经在客户端上。

为什么要重新传输客户端已经拥有的所有数据？为什么要在客户端上有代码从围绕该数据的所有不必要的标记中解析出它正在寻找的数据？

让您的操作保持简单。如果您需要一个接收数据、执行逻辑并返回结果的服务器端操作，请创建一个完全执行此操作的操作。在 AJAX 中调用该操作并使用生成的 数据。

现在，响应可能是结构化的 JSON 数据，您的客户端代码可以读取这些数据并相应地更新 UI。或者，该响应可能是原始 HTML（不是整个页面，而是单个 <div> 或任何显示页面部分更新版本的容器），您的客户端代码可以直接切换到 UI。

与服务器的 AJAX 交互通常应该是轻量级的。如果您有意在 AJAX 操作中重新加载整个页面，那么，为什么首先要使用 AJAX？关键是只向服务器发送它需要的数据，并且只从服务器接收你需要的数据。例如，如果您只需要更新页面上显示的记录列表，那么您不需要整个页面甚至 HTML 记录表，您只需要记录即可。 JSON 正是为此非常有用，它将结构化数据和仅结构化数据返回给客户端。然后客户端代码可以将该数据呈现到页面结构中。

【参考方案2】：

现在我是否总是需要创建一个单独的文件来处理 AJAX 发送的数据？

是和不是。您可以选择不使用 ajax 正在拉取的特定文件，但您确实需要某种路由和控制器关系，因为大多数框架都会构建它。

理论上，您可以向自己（同一页面）创建一个请求，但这是错误的逻辑。你将把后端逻辑与前端混合起来，很快就会变得一团糟。您确实需要将所有三个元素分开，

PHP 获取数据并进行处理 JavaScript 获取数据并显示它 您的 html 应该是无代码的；只是一个非常完善的产品。

最好的设计模式是在适当的环境中分离这些文件。

我不能只是“抓取”数据并在同一页面上使用它吗？

并非如此，至少并非始终如一。您还必须记住，尝试从同一个路由/文件中提供两个单独的内容是一个潜在的问题：

if ajax 
// do something
else
// do the other thing

Ajax 不希望完全呈现 HTML 文件，这需要太长时间；最好提供 JSON 对象/数组，这些对象/数组将通过 JavaScript 在您的前端呈现；这也用于发出请求 - 在用户的浏览器中，没有由他们的网络或您的服务器引起的延迟。

由于没有来自客户端的数据是可信的，包括 HTTP 标头，因此无法确定哪个请求是什么；它们很容易伪造，并可能导致安全/不良结果。

因此，最好的解决方案是拥有一个您可以向其发出请求的外部文件，而不是从其自身发出请求。