0

Necesito establecer el src de una imagen y no logro ubicar el archivo dentro del servidor.

Explico:
Las carpetas de mi proyecto están asi dentro de mi proyecto de nombre CMSProject:

CMSProject  

     -Areas

     -Bin

     -Content

     -Controllers

     -Models

     -Views

El archivo desde donde quiero setear el atributo src esta en un subdirectorio (Shared) de la carpeta Areas:

 -Areas
    
    -Admin
       
        -Views

            -Shared

               DowloadReport.cshtml

El archivo que nesecito encontrar esta en un subdirectorio (Images) de la carpeta Content:

 - Content

        -Images

               loading.gif
  

Yo escribi algo asi, pero me dice que no encuentra el archivo...

¿Como puedo hacer para resolver este problema?

 function checkReport(reportTitle) {
    if (growl == null || growl == undefined) {
        growl = $.iGrowl({
        type: 'simple',
            delay: 0,
            title: reportTitle,
            small: false,
            message: 'Su reporte se está generando. Una vez finalizado será descargado en su navegador.',
            placement: {
                x: 'right',
                y: 'bottom'
            },
            animShow: 'fadeInUp',
            animHide: 'fadeOutDown',
            icon: 'vicons-support',
            image: {
                src:"../Content/loading.gif"
            }
        });

        $(".igrowl-dismiss").html("X");
    }
    IsGenerated();
    checkingReport = setInterval(IsGenerated, 10000);
}
3
  • Gracias Tryby .. y ¿como seria eso ? Commented el 8 jul. 2020 a las 17:06
  • ...y además debe ser accesible al servidor web. Si la imagen está fuera del ámbito del servidor web no hay forma de que puedas llegar a ella
    – luisfer
    Commented el 8 jul. 2020 a las 17:06
  • Gracias luisfer ..Agradeceria que fueras un poco mas explicito en tu respuesta ..algo de codigo seria buenisimo Commented el 8 jul. 2020 a las 17:08

2 respuestas 2

1

La ruta de la imagen debe ser relativa a la URL que estás viendo en el navegador y tú la estás poniendo con base en la ubicación de la vista. Creo que lo mejor sería crear una variable en Javascript con la ruta absoluta del sitio y usarla para asignar la imagen.

De preferencia en la plantilla del proyecto, dentro de <head> ... </head>, y antes de cualquier script que requiera acceso a la ruta coloca:

<script>
// Puedes usar el dominio completo o solo /
// Si el proyecto está dentro de una carpeta, no olvides agregarla:
// Por ejemplo: https://www.midominio.com/ruta-del-proyecto/
const CMSProjectUrl = 'https://www.midominio.com/';
</script>

Luego, en tu función:

function checkReport(reportTitle) {
    if (growl == null || growl == undefined) {
        growl = $.iGrowl({
        type: 'simple',
            delay: 0,
            title: reportTitle,
            small: false,
            message: 'Su reporte se está generando. Una vez finalizado será descargado en su navegador.',
            placement: {
                x: 'right',
                y: 'bottom'
            },
            animShow: 'fadeInUp',
            animHide: 'fadeOutDown',
            icon: 'vicons-support',
            image: {
                // Agregas la ruta absoluta del sitio
                src: CMSProjectUrl + 'Content/loading.gif'
            }
        });

        $(".igrowl-dismiss").html("X");
    }
    IsGenerated();
    checkingReport = setInterval(IsGenerated, 10000);
}

Esto te servirá también para ejecutar scripts por AJAX:

$.ajax(CMSProjectUrl + 'carpeta/scripts/archivo.ext');
1

Si checkReport se encuentra dentro de la vista que se renderiza desde el servidor (DowloadReport.cshtml) se puede aprovechar el sistema de plantillas y el renderizado del servidor para que determine la ruta relativa del archivo con Url.Content de la siguiente manera.

function checkReport{
    ...
    image: {
        src: '@Url.Content("~/Content/Images/loading.gif")',    // Basado en la estructura de directorio que se presenta en la pregunta.
    },
    ...
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.