C# doubt with html

Question

I have an application that carries an image that is inside the project. When I pass the directory manually (eg.: src="~/Imagens/logoACESSO.png") it loads the image normally, but when I pick the same path for a C# variable it does not load the image (eg.: src="@chegadas.Ds_Caminho_Logo").

The value of the variable is exactly the same as the path: ~/Images/logoACESSO.png.

HTML code

<div>
<table class="table table-sm table-striped table-active" style="overflow-x: auto; overflow-y: auto;">
    <thead style="background-color:black; color: white; font-size: 22px;">
        <tr>
            <th style="width: 150px;">EMPRESA</th>
            <th style="width: 260px;">ORIGEM</th>
            <th style="width: 300px;">DESTINO</th>
            <th style="text-align: center; width: 120px;">CHEGADA</th>
            <th style="text-align: center; width: 100px;">PARTIDA</th>
            <th style="text-align: center; width: 60px;">BOX</th>
            <th style="text-align: center;">OBSERVAÇÃO</th>
        </tr>
    </thead>
    <tbody class="font-weight-bold" style="font-size: 18px;">
        @foreach (var chegadas in Model)
                {
                    string caminhoImagem = chegadas.Ds_Caminho_Logo;

                    if (@chegadas.Ds_Cidade_Origem == "CHEGADAS DO DIA")
                    {
                <tr>
                    <td colspan="7" class="linha-data-seguinte" style="text-align: center; background-color: rgba(245, 184, 52, 0.63);">
                        <img class="imagem-seta" src="~/Imagens/seta-para-baixo_318-1470.png" />
                        @chegadas.Ds_Cidade_Origem @chegadas.Ds_Cidade_Destino @chegadas.Hr_Chegada_Local
                        <img class="imagem-seta" src="~/Imagens/seta-para-baixo_318-1470.png" />
                    </td>
                </tr>
            }
            else
            {
                <tr>
                    @*<td style="text-align: left;">@chegadas.Ds_Empresa</td>*@
                    @if (chegadas.Ds_Caminho_Logo == null)
                    {
                        <td style="text-align: left;">@chegadas.Ds_Empresa</td>
                    }
                    else
                    {
                        <td style="text-align: left;"><img height="35" src="@new HtmlString(chegadas.Ds_Caminho_Logo)" /></td>

                        @*<td style="text-align: left;"><img height="35" src="~/Imagens/logoACESSO.png" /></td>*@
                    }
                    <td style="vertical-align: middle; text-align: left;">@chegadas.Ds_Cidade_Origem</td>
                    <td style="vertical-align: middle; text-align: left;">@chegadas.Ds_Cidade_Destino</td>
                    <td style="text-align: center; vertical-align: middle;">@chegadas.Hr_Chegada_Local</td>
                    <td style="text-align: center; vertical-align: middle;"><!-- CHEGADAS NÃO MOSTRA HORA DE PARTIDA --> @*@chegadas.Hr_Saida_Local*@</td>
                    <td style="text-align: center; vertical-align: middle;">@chegadas.Ds_Plataforma</td>
                    <td style="color: red;"><marquee>@chegadas.Ds_Observacao</marquee></td>
                    @*<td><div class="marquee"><span>@chegadas.Ds_Observacao</span></div></td>*@
                </tr>
            }
        }
    </tbody>
</table>

Controller Code

public class PainelPartidasEChegadasController : Controller
{

    // GET: PainelPartida
    public ActionResult PainelPartidas()
    {
        PainelPartidaDAO dao = new PainelPartidaDAO();
        IList<PainelPartida> partidas = dao.Partidas();
        ViewBag.Title = "Partidas";

        return View(partidas);
    }

    public ActionResult PainelChegadas()
    {
        PainelChegadaDAO dao = new PainelChegadaDAO();
        IList<PainelChegada> chegadas = dao.Chegadas();
        ViewBag.Title = "Chegadas";

        return View(chegadas);
    }
}

DAO

public IList<PainelChegada> Chegadas()
    {
        /*
         * consulta feita passando a query pelo C#
         * 
         * var lista = new List<PainelChegada>();
         * var select = conexao.CreateCommand();
         * select.CommandText = "select e.Ds_Empresa, l.Cd_Cod_Linha, l.Ds_Cidade_Origem, l.Ds_Cidade_Destino, l.Hr_Chegada_Local, l.Hr_Saida_Local, p.Ds_Observacao, l.Hr_Chegada_Destino from Cd_Linha l, Cd_Partidas p, Cd_Empresa e, cd_parametro r where l.Cd_Cod_Linha = p.Cd_Cod_Linha and e.Cd_Empresa = l.Cd_Empresa and l.Ds_Cidade_Origem <> r.ds_cidade_origem order by l.Hr_Chegada_Local asc";
        */

        //Consulta feita passando procedures do SQL
        var lista = new List<PainelChegada>();

        SqlCommand select = new SqlCommand("SP_Painel_Partida_Chegada", conexao);

        select.CommandType = CommandType.StoredProcedure;

        select.Parameters.AddWithValue("@Exec", "SEL");
        select.Parameters.AddWithValue("Procedimento", 2);

        int contador = 0;
        var resultado = select.ExecuteReader();

        while (resultado.Read())
        {
            PainelChegada pc = new PainelChegada();

            if (Convert.ToString(resultado["PrevSaida"]) == "----------")
            {
                string proximaData = Convert.ToString(resultado["EfetivaChegada"]);
                string diaDaSemana = Convert.ToString(resultado["Observacao"]);

                pc.Ds_Empresa = "";
                pc.Cd_Cod_Linha = "";
                pc.Ds_Cidade_Origem = "CHEGADAS DO DIA";
                pc.Ds_Cidade_Destino = proximaData;
                pc.Hr_Chegada_Local = diaDaSemana;
                pc.Hr_Saida_Local = "";
                pc.Ds_Observacao = "";

                lista.Add(pc);
                contador++;
            }
            else if (contador < 13)
            {

                pc.Ds_Empresa = Convert.ToString(resultado["Empresa"]);
                pc.Ds_Caminho_Logo = Convert.ToString(resultado["Ds_Caminho_Logo"]);
                pc.Cd_Cod_Linha = Convert.ToString(resultado["Linha"]);
                pc.Ds_Cidade_Origem = Convert.ToString(resultado["CidadeOrigem"]);
                pc.Ds_Cidade_Destino = Convert.ToString(resultado["CidadeDestino"]);
                pc.Hr_Chegada_Local = Convert.ToString(resultado["PrevChegada"]);
                pc.Hr_Saida_Local = Convert.ToString(resultado["PrevSaida"]);
                pc.Ds_Observacao = Convert.ToString(resultado["Observacao"]);
                pc.Ds_Plataforma = Convert.ToString(resultado["Ds_Plataforma"]);

                lista.Add(pc);
                contador++;

            }
            else
            {
                break;
            }
        }

        resultado.Close();

        return lista;
    }

Answer 1

I found the solution! I will put as an answer if someone goes through the same problem in the future.

The application was saving the image path in the way that Visual Studio auto-completes the mapping of its directories, ie it puts the "~" before the mapping of the directory (Ex.: ~/Imagens/logoACESSO.png). When we write directly in Visual Studio this way it recognizes as valid character, but when it comes from the bank Visual Studio does not recognize the character.

I believe that for some reason SQL should use different bytes than Visual Studio to represent the "~".

But the solution is this: when you save the image path in the database, you have to remove the "~".

Answer 2

I had a problem similar to yours, and the solution I found was to store the binary image in the database, and so load it with the code below.

Below the view that loads the data.

@model BDM.Models.MdImagemProd
@{
    Layout = null;
    var base64 = Convert.ToBase64String(Model.ImagemData);
    var imgscr = string.Format("data:image/gif;base64,{0}", base64);
}
<img src='@imgscr' style="height:100px; width:100px" />