更好的方法

Question

在我的页面中，我有这条显示图像的路径。

实施例

<link rel="icon" type="image/png" href="/img/logo.png"/>

我的图片无法显示，因为在我的Apache路径为：

/var/www/html/apps/stc-1.0-r-20170516195017/img/logo.png

我的路径的特殊性是我的应用程序每天都在重建，所以这个参数stc-1.0-r-20170516195017 is dynamic

我的问题是如何通过javascript来获取我的路径/apps/static-[DYNAMIC_VALUE]/？

提示：我的根目录是：/var/www/html/

我的页面：

<!DOCTYPE html>
<html dir="ltr" lang="fr">

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=no" />
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <link rel="icon" type="image/png" href="/img/logo.png" />
  <title>Erreur 404</title>
  <link rel="stylesheet" type="text/css" href="/css/theme.css" />
  <link rel="stylesheet" type="text/css" href="/css/theme.css" />
</head>

<body>
  <div id="app">
    <div id="site">
      <div class="header" id="header-container">
        <header>
          <div id="header">
            <div class="inside">
              <div class="fl"><a class="header-link" title="Retour à l&#x27;accueil de Google" href="http://www.google.com/">Google</a>
              </div>
            </div>
          </div>
          <div id="banner">
            <div role="banner" class="inside">
              <div class="fl menu-main-conteneur ">
                <nav id="menu-main" aria-label="Menu principal" data-title="Menu" class="menuHaut"></nav>
              </div>
              <div class="fl w10 mls">
                <a class="sub-header-link" href="/accueil" title="Retour vers la page d&#x27;accueil " id="img-logo"><img src="img/logo.png" alt="Application" /></a>
              </div>
              <div class="fl mls">
                <a class="sub-header-link" href="/apps/accueil" title="  Retour vers la page d&#x27;accueil ">
                  <h1 id="app-title">Application </h1>
                </a>
              </div>
            </div>
          </div>
        </header>
      </div>
      <main id="page" role="main">
        <span></span>
        <div id="nfe-page">
          <div id="nf-img"></div>
          <h2 class="nfe-title">Oops! Nous ne trouvons pas ce que vous cherchez!</h2><a href="/apps/accueil" class="button nfe-button">Retour à la page d&#x27;accueil</a>
        </div>
      </main>
      <footer id="ft" class="footer-container" role="contentinfo">
        <div id="footer" class="footer-content inside">
          <div class="fl mll">
            <ul class="footer-links">
              <li><a href="/apps/planAppli" title="Plan de l&#x27;application l&#x27; Application ">Plan de l&#x27;application</a>
              </li>
              <li><a href="/apps/politiqueAccessibilite" title="Politique d&#x27;accessibilité de l&#x27; Application ">Accessibilité</a>
              </li>
              <li><a href="/apps/contact" title="Contact de l&#x27; Application ">Contact</a>
              </li>
            </ul>
          </div>
          <div class="fr mrl">
            <p>Application </p>
          </div>
        </div>
      </footer>
    </div>
  </div>

</body>

</html>

Answer 1

更好的方法

是在您的配置文件下应用一些更改。但是因为我对他们的解释不够......

替代

在您的情况下，您可以绕过动态行为通过使用动态模式递归获取例外文件：

$iter = new RecursiveIteratorIterator
(
    new RecursiveDirectoryIterator($you_root_dir, RecursiveDirectoryIterator::SKIP_DOTS),
    RecursiveIteratorIterator::SELF_FIRST,
    RecursiveIteratorIterator::CATCH_GET_CHILD // Ignore "Permission denied"
);

foreach ($iter as $path => $fileinfo)
{
    if($fileinfo->isDir() && preg_match("/^stc-.*[\d]+$/i", $fileinfo->getFilename()))
    {
        $logo = $path."/img/logo.png";
        if(file_exists($path."/img/logo.png"))
        {
            header("Content-Type:image/png");
            header("Content-Length: ".filesize($logo));
            readfile($logo);
            break;
        }
    }
}

但是，如果在创建时保留静态目录，你应该把最新的目录放在最新的目录上。

// sort and get the newest dir
$dirs = [];
array_walk(scandir($path, SCANDIR_SORT_DESCENDING),
function($d, $k) use(&$path, &$dirs)
{
    if(is_dir($path.$d) && !preg_match("/^\.+$/", $d))
        $dirs[filemtime($path.$d)] = $d;
});
ksort($dirs);

// check and show the img
$logo = array_pop($dirs)."/img/logo.png";
if(file_exists($logo))
{
    header("Content-Type:image/png");
    header("Content-Length: ".filesize($logo));
    readfile($logo);
}

您必须将所需代码放在名为logo.php

的新文件中

可从您的网络根目录调用，如：

<img src="logo.php">

Answer 2

如果您有自己的路径，可以使用以下方法获得所需的部分：

var path='/var/www/html/apps/stc-1.0-r-20170516195017/img/logo.png';
var part = path.match(/(\/apps\/.+\/)img/);

alert (part[1]);

修改：

好的，如果你没有JS中的路径，你可以得到它，如果你在输入字段的PHP部分中编写它并从那里用JS读取它：

<input type="text" id="path" value=<?php echo realpath(dirname('img/logo.png'));?> />

<script>
    var path = document.getElementById('path').value;
</script>

从动态或定期更新的路径加载图像

2 个答案:

更好的方法

替代