多文件场景下Ajax请求路径适配问题咨询

这是个非常常见的多目录项目路径问题，不用复制JS代码到每个文件，也不用硬编码固定URL，给你几个实用的动态解决方案：

方案1：使用站点根目录绝对路径（最推荐） #

直接把Ajax请求的URL改成以/开头的绝对路径，这种方式会直接基于站点的根目录发起请求，不管当前页面在哪个子目录下都能正确指向资源：

// 在newsletter_init.js里修改请求URL
$.ajax({
  url: '/res/ajax/request_newsletter.php',
  // 其他配置...
});

• 原理：/代表站点的根目录，在localhost环境下就是localhost/res/ajax/request_newsletter.php，切换到正式站点后就是你的域名/res/ajax/request_newsletter.php，完美适配环境切换。
• 优点：零额外代码，最简单直接，适合你的项目结构。

方案2：PHP传递全局根路径变量给JS #

如果你的项目未来可能部署在站点子目录下，或者需要更灵活的路径控制，可以在PHP中定义全局的根路径变量，传递给JS使用：

1. 在所有PHP文件共有的头部（比如header.php，如果有的话）添加以下代码：

<script>
// 获取站点完整根路径（包含协议、域名）
const BASE_URL = "<?php echo $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST']; ?>";
// 或者如果项目部署在子目录，比如localhost/myproject，就用这个：
// const BASE_URL = "<?php echo $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['SCRIPT_NAME']); ?>";
</script>

2. 在newsletter_init.js中使用这个变量拼接请求URL：

$.ajax({
  url: BASE_URL + '/res/ajax/request_newsletter.php',
  // 其他配置...
});

方案3：利用HTML的标签 #

通过设置<base>标签统一页面内所有相对路径的基准：

在每个PHP文件的<head>中添加：

<base href="<?php echo $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/'; ?>">

之后你的JS里直接写原来的相对路径res/ajax/request_newsletter.php即可，所有相对路径的请求都会自动基于<base>指定的根路径发起。

⚠️ 注意：这个标签会影响页面内所有相对路径的资源（比如CSS、图片、链接），如果你的其他资源路径已经是正确的，需要确保它们也适配这个基准路径，否则可能导致资源加载失败。

补充：关于你尝试过的方法 #

• 对于__DIR__：你可以在PHP中用realpath(__DIR__ . '/../')获取根目录（比如blog目录下的__DIR__是blog文件夹，../就是根目录），然后输出为JS变量，本质和方案2类似。
• 对于$(location).attr('pathname')：你可以通过截取路径的方式获取根目录，但不如前面的方案可靠，因为不同环境下路径格式可能有差异。

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