使用 JavaScript 或 jQuery,我们可以检查文件是否存在并检索有关文件的元数据,例如文件的大小、内容类型、上次修改日期等,而无需检索实际文件。在这种情况下使用 HTTP HEAD 请求。 HTTP HEAD 请求是一种 HTTP 请求,它要求服务器返回指定资源的 HTTP 标头,而不返回实际资源本身。
可以使用多种方法发送 HTTP HEAD 请求,但最流行的方法是使用 $.ajax() 方法和 XMLHttpRequest 对象。用户可以使用这些方法中的任何一种将请求类型定义为“HEAD”,并且还可以包含回调函数来处理响应。如果服务器响应中文件存在,则将调用回调函数。如果文件不存在,则不调用回调函数,并抛出异常。
如果我们发现提到的文件存在,我们可以采取任何行动,例如显示实际文件或显示由文件元数据组成的消息等。如果提到的文件不存在,我们可以显示错误消息存在。它将提高我们没有尝试获取实际大文件的性能;而不是我们检查它的状态。
要使用 jQuery 中的 $.ajax() 方法检查文件是否存在,我们可以使用以下步骤 -
创建一个包含类型、“url”、“成功”和“错误”选项的对象。 type 选项应设置为“HEAD”,“url”选项应设置为我们要检查的文件的 URL,“success”和“error”选项应为回调函数,用于在以下情况下处理响应:请求分别是成功或失败。
调用“$.ajax()”方法并传入我们在步骤 1 中创建的对象作为参数。
在“成功”回调函数中,如果文件存在,我们可以采取任何所需的操作。例如,我们可以向用户显示文件或执行其他操作。
在“错误”回调函数中,如果文件不存在,我们可以采取任何所需的操作。例如,我们可以显示错误消息或将用户重定向到不同的页面
$.ajax({ url: url, type: 'HEAD', success: function () { // The mentioned file exist! }, error: function () { // The mentioned file does not exist! }, })
语法显示 type 属性设置为 HEAD 以指定我们正在向服务器发送 HEAD 请求。 url 属性设置为我们想要向其发送请求的服务器端脚本或应用程序的 URL。
在这个例子中,我们使用ajax方法检查提到的文件是否存在。我们使用了jQuery的ajax库。将输入字段放入不同的文件路径中以检查它们是否存在。如果文件存在,成功函数会在网页上显示“提到的文件存在!”消息,如果文件不存在,则错误函数会在网页上显示“提到的文件不存在!”。
<html> <head> <script src ="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> </head> <body> <h2>Checking if Mentioned <i>File Exists or not</i> using JavaScript/jQuery</h2> <h4>Enter file path:</h4> <input id = "file_path" name = "file_path" /> <button onclick="checkFile()">Check File</button> <div id = "root" style = "padding: 10px; background: #b8f0ea"></div> <script> let root = document.getElementById('root') let file_path = document.getElementById('file_path') function checkFile() { $.ajax({ url: file_path.value, type: 'HEAD', success: function () { root.innerHTML = 'The mentioned file exist!' }, error: function () { root.innerHTML = 'The mentioned file does not exist!' }, }) } </script> </body> </html>
要使用 JavaScript 中的“XMLHttpRequest”对象检查文件是否存在,我们可以使用以下步骤 -
创建一个新的“XMLHttpRequest”对象。
使用“XMLHttpRequest”对象的“open()”方法指定我们要检查的文件的 URL,并将请求方法设置为“HEAD”。
使用“XMLHttpRequest”对象的“send()”方法发送请求。
检查“XMLHttpRequest”对象的“status”属性以查看该文件是否存在。如果'status'属性为200,则文件存在;如果“status”属性为 404,则该文件不存在。
var http = new XMLHttpRequest() http.open('HEAD', url, false) http.send() if (http.status === 200) { //This file exist! } else { //This file does not exist! }
在上面的语法中,我们使用了 XMLHttpRequest(),并且根据状态代码,我们可以编写文件是否存在的代码。
在此示例中,我们使用 XMLHttpRequest() 方法检查提到的文件是否存在。将输入字段放入不同的文件路径中以检查它们是否存在。如果文件存在,则状态码将为 200,并且我们将显示“此文件存在!”消息,如果文件不存在,则错误函数在网络上显示“此文件不存在!”页。
<html> <body> <h2>Checking If Mentioned File Exists or not using JavaScript/ jQuery</h2> <h4>Enter file path:</h4> <input id = "file_path" name = "file_path" /> <button onclick = "checkFile()">Check File</button> <div id = "root" style = "padding: 10px; background: #f0ecb8"></div> <script> let root = document.getElementById('root') let file_path = document.getElementById('file_path') function checkFile() { var http = new XMLHttpRequest() http.open('HEAD', file_path.value, false) http.send() if (http.status === 200) { root.innerHTML = 'This file exist!' } else { root.innerHTML = 'This file does not exist!' } } </script> </body> </html>
检查提到的文件是否存在是使用大数据文件的一个好习惯,JavaScript 和 jQuery 使我们有能力检查它。
以上是如何使用 JavaScript/jQuery 检查提到的文件是否存在?的详细内容。更多信息请关注PHP中文网其他相关文章!