从数据库获取图像的功能不起作用答案

【问题标题】：function to get image from database is not working从数据库获取图像的功能不起作用
【发布时间】：2019-08-18 11:58:19
【问题描述】：

我是 Javascript 新手。我想为我所有项目的网页添加一个图标。这个图标会随着登录我页面的人而改变。我现在正在尝试的是，在母版页加载中（当我在代码隐藏中拥有所有数据时，包括他选择的图标），我引入了一个 js 函数来更改图标：

    (function icon(image) {
        var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
        link.type = 'image/x-icon';
        link.rel = 'shortcut icon';
        link.hre = image;
        document.getElementsByTagName('head')[0].appendChild(link);
    })();

（改编自这里：Changing website favicon dynamically）

我试图用 Page.ClientScript.RegisterStartupScript() 方法调用这个函数：

  (protected void Page_Load(object sender, EventArgs e)
  {
  if (!Page.IsPostBack)
     {
        //...

        UserModel usuario = (UserModel)Session["usuario"];

        //...

        Page.ClientScript.RegisterStartupScript(this.GetType(), "icone", $"icone({(Bitmap)new ImageConverter().ConvertFrom(usuario.imagem)});", true);
     }
  }

该方法根本没有执行（它也没有返回错误，它只是“跳转”），我真的不知道为什么。

OOOOR，可能有更好的方法，但我就是想不通。

为了记录，我没有文件夹上的图标/图像。我必须从数据库中获取它们。

（我稍后会为用户在数据库中没有图像时添加验证。假设现在它永远不会为空）。

【问题讨论】：

简单地创建一个返回图像并将其直接作为shortcut-icon的href而不是诉诸Javascript的动作不是更容易吗？

标签： javascript c# web

【解决方案1】：

有几点需要修改：

首先，认为您没有按要求设置 RegisterStartupScript 的参数。第三个值应该是要运行的 javascript 代码。您可以将整个脚本添加为变量（如此处所示：https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.clientscriptmanager.registerstartupscript?view=netframework-4.7.2），或者您可以将<script>...</script> 标记中的函数添加到 HTML 页面，然后只需从 RegisterStartupScript 中调用该函数（作为第三个参数值)

其次，您的 JavaScript 函数中有一个错字：

link.hre = image; 应该是link.href = image;

第三，（这部分可能需要一些工作）图像必须是实际图像的 URL（字符串）（不是二进制位图）...您可能首先必须将图像作为.jpg 或 .png 并使用其 URL 到那里，或者您必须将图像转换为 Base64 并通过数据 URL https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs添加图像

最后，您修改了原始示例中的 JavaScript（您提到）在这种情况下，您想将图像 URL 作为参数发送给函数 icon 但是，封装了 icon 函数。所以这个函数基本上是在一个私有范围内。如果需要从页面上的另一个函数调用，请删除函数周围的封装...希望这有意义。

【讨论】：

【解决方案2】：

您可以简单地将快捷方式图标链接到处理程序，而不是使用 Javascript，该处理程序会立即返回图像。（以下代码未经测试，仅用于描述基本流程！）

在您的页面中：

<link rel="shortcut icon" type="image/x-icon" href="/userimage.ashx">

userimage.ashx：

<%@ WebHandler Language="C#" Class="UserImageHandler" %>

userimage.ashx.cs:

using System;
using System.Web;

public class UserImageHandler : IHttpHandler {

    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "image/png"; // or image/jpg, image/bmp, ...
        var image = FetchImageFromDatabase(context.User.Identity.Name); // your logic for fetching the image from the database
            // You could also return a default image here, if the user has not selected one.
        context.Response.Write(image); // Write the binary data to the response stream.
    }

    public bool IsReusable {
        get {
            return false;
        }
    }
}

【讨论】：