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

【问题标题】：Can I redirect a page to an image so it'll work in an IMG tag?我可以将页面重定向到图像以便它可以在 IMG 标记中工作吗？
【发布时间】：2016-03-12 04:42:25
【问题描述】：

有没有办法让页面重定向到图像文件，使其可以在图像标签内工作？一个简单的例子是这样的

page1.html:

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

page2.html

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

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

【问题讨论】：

如果这是不可能的（我很确定这是不可能的——也许如果你有一个嵌入了 JavaScript 的 SVG 会在其中加载另一个图像），你可以考虑改用 iframe。
您可以将图像动态加载到脚本化的 SVG 文档中，但从标签运行脚本时（不幸的是）禁用了脚本；您需要改用之类的东西，这可能会失败。

标签： javascript html

【解决方案1】：

这是不可能的。浏览器发出的填充img 标记的请求需要具有图像内容的响应。 HTML 文件是该响应中返回的内容，并且由于该响应不包含重定向标头，因此浏览器不会向任何地方发出另一个请求。由于页面试图加载到img 标记中，因此页面上的 JS 甚至都不会帮助您，因为该 JS 甚至不会运行，因为浏览器没有将 HTML 文档解析为 HTML 文档。它只会导致图像链接损坏。

如果您无法控制服务器，因此您可以控制对向它发出的请求的响应，那么在这种特殊情况下您就不走运了。

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

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

【讨论】：

【解决方案2】：

我不这么认为，因为 src 功能。

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

【讨论】：

【解决方案3】：

如果可能的话，我需要能够在纯 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代码的sn-p中，对/page2.html的请求会导致文件bird.png被发送到浏览器。这将允许您使用page2.html 作为src 的img 标签，如下所示：

<img src="page2.html">

这种方法需要服务器端处理。

here提出了类似的问题

【讨论】：