没有通过jquery ajax从服务器cpanel加载图像文件



我不知道这是否是一个重复的问题,但我已经搜索过了,找不到这个的解决方案

我是cpanel的新手,最近我上传了我的项目。现在我的网站上有一个部分,我正在通过jquery ajax加载一个图像文件夹。现在,这在本地服务器xampp中工作得很好,但在服务器中却没有,它一直给出404错误,这意味着ajax脚本没有发现文件。出于安全原因,我现在不打算分享链接,但我会解释的完整程序

这些是这些文件夹的位置。这些脚本在js文件夹中。但很明显,它包含在索引页中。无论如何,让我们移动

var svgFolder = "img/svg/";
var productImagesFolder = "img/ImagesForProducts/";

以下是我用来加载这些文件夹的图像的ajax脚本

$.ajax({
url: svgFolder,
success: function (data) {
$(data).find("a").attr("href", function (i, val) {
if (val.match(/.(jpe?g|svg)$/)) {
$(".svg-shapesDiv").append("<img src='" + svgFolder + val + "' id='svg-shapes' loading='lazy'>");
}
});
}
});
$.ajax({
url: productImagesFolder,

success: function (data) {
$(data).find("a").attr("href", function (i, val) {
if (val.match(/.(jpe?g|jpg)$/)) {
$("#avatarlist").append("<img style='cursor:pointer;' class='img-polaroid' src='" + productImagesFolder + val + "' loading='lazy'>");
}
});
}
});

所有这些都在localhost服务器上运行良好,但由于某种原因,当我将它们上传到cpanel时,它停止了工作。

我试着像这个一样对img标签进行编码

<img src='img/svg/file.svg' id='svg-shapes' loading='lazy'>
<img src='img/ImagesForProducts/file.png' id='svg-shapes' loading='lazy'>

我尝试过的东西

这很好,所以我认为ajax没有弄清楚地址。我还试着在浏览器中通过链接搜索图像,比如domainname.com/img/svg/file.svg,它也很好。我还尝试给ajax提供类似domainname.com/img/svg/file.svg的路径,但它不起作用。我检查了文件的大小写等,但都是正确的

如果这是一个愚蠢的问题,那么我很抱歉,但我不知道我做错了什么,我也是cpanel和现场主持的新手。

根据对我的评论的回应,听起来你的examplep好像有"索引";默认情况下启用。请参见此处:https://httpd.apache.org/docs/2.4/mod/mod_autoindex.html

这可能是因为在您的共享网络托管上,它们在默认情况下被禁用,您需要为这两个目录启用它们。由于您正在使用cpanel,请参阅此处:https://docs.cpanel.net/cpanel/advanced/indexes/82/但这也可以通过将.htaccess文件添加到包含CCD_ 4的2个文件夹来实现。

以这种方式依赖索引的问题是,不同的服务器可能会返回略有不同的html,因此您可能会发现您的xampp服务器返回html链接(您的JavaScript搜索锚标记并从中获取href(,但共享服务器可能不会返回链接,它可能只返回文件名。此外,返回该html后,您的JavaScript必须解析该html,搜索所有链接并提取href。因此,我建议编写一个php脚本,收集相关文件并只返回JSON格式的文件。这样JavaScript就更容易解析和使用了,现在您可以完全控制返回的内容,无论它是在您的xampp服务器上还是在其他主机上。你可以随心所欲地调用这个脚本,也可以把它放在任何你想放的地方。您甚至可以有一个脚本,从AJAX调用中接受查询参数,并从这些参数中知道要查看哪个文件夹以及必须从文件夹中收集哪些类型的文件。这样做的好处还在于,可以将这些文件夹中的所有其他文件隐藏起来,以免被窥探。

最新更新