Question

有没有办法让页面重定向到图像文件，以便它可以在图像标记内工作？一个简单的例子就像是

page1.html：

<html>
  <img src="page2.html">
</html>

page2.html

<html>
  <script> //redirect to dynamicallyChosenImage.png </script>
</html>

如果可能的话，我需要能够在纯HTML / Javascript中执行此操作（我的服务器不允许任何服务器端处理）。

Answer 1

这是不可能的。浏览器填充img标记的请求需要对图像内容进行响应。 HTML文件是该响应中返回的内容，由于该响应不包含重定向标头，因此浏览器不会向任何地方发出其他请求。由于页面正在尝试加载到img标记，因此页面上的JS甚至不会帮助您，因为JS甚至无法运行，因为HTML文档未被浏览器解析作为HTML文档。它只会导致图像链接断开。

如果您无法控制服务器，那么您可以控制对其发出的请求的响应，那么您在这种特定情况下运气不佳。

考虑到这一点，您是否考虑过在页面上使用JavaScript根据您需要的逻辑有条件地将实际图片网址加载到img标记中？你究竟想做什么？这是一个简单的JavaScript示例，可以在按钮点击时切换img标记的来源：

http://codepen.io/anon/pen/PNzjxe

Answer 2

如果可能的话，我需要能够在纯HTML / JavaScript中执行此操作（我的服务器不允许任何服务器端处理）。

无法在客户端上的纯 JavaScript / HTML中完成此操作。

您需要某种形式的 服务器端处理 ，例如PHP或服务器上运行的其他内容才能执行此操作。

一般情况下，我认为您稍后在查看代码时会发生什么困扰。例如，您（或其他审核代码的开发人员）可能认为这是一个拼写错误，然后想要将.html更改为.jpg或.png

话虽如此，您尝试做的事情可以通过以下方式完成：

服务器端处理（JavaScript）

wakanda个应用可以拥有自定义HTTP Request Handlers。这种方法是纯JavaScript，但它需要服务器端处理。

这是一个返回图像的JavaScript函数：

function doReturnImage(request, response) {
    var varImage = application.loadImage(application.getFolder().path+'WebFolder/'+'myPict.png');
    response.contentType = 'image/png';   
    return varImage;
}

假设在boot.js中定义了上面的函数，那么这里是请求处理程序用addHttpRequestHandler调用上面的函数：

addHttpRequestHandler("/page2.html", "boot.js" , "doReturnImage");

服务器端处理（备选）

4d-database在On Web Connection数据库方法中包含以下代码：

// On Web Connection
C_TEXT($1;$2;$3;$4;$5;$6)
C_TEXT($url_t)
$url_t:=$1
Case of 
  : ($url_t="/page2.html")
    // return an image for this html request
    $folder:=Get 4D folder(Database folder)
    WEB SEND FILE($folder+"bird.png")
End case

在上面的4D代码片段中，对/page2.html的请求将导致文件bird.png被发送到浏览器。这样您就可以使用page2.html作为src标记的img，如下所示：

<img src="page2.html">

此方法需要服务器端处理。

提出类似的问题here

Answer 3

由于src的功能，我不这么认为。

src attribute指示浏览器在服务器上应该查找要呈现给用户的图像。这可能是同一目录中的图像，同一服务器上其他位置的图像，或另一台服务器上存储的图像。

我可以将页面重定向到图像，以便它可以在IMG标签中工作吗？

3 个答案:

服务器端处理（JavaScript）

服务器端处理（备选）