Problema con modulo prestashop al no soportar SSL

Iniciado por Stiuvert, Septiembre 12, 2017, 06:11:06 PM

Tema anterior - Siguiente tema

0 Miembros y 1 Visitante están viendo este tema.

Septiembre 12, 2017, 06:11:06 PM Ultima modificación: Septiembre 12, 2017, 06:12:58 PM por Stiuvert
Hola compañeros,

He instalado SSL en Prestashop pero resulta que hay un modulo que no lo soporta, este modulo es un slider que muestra las imágenes subidas por "http". Este modulo solo está situado en el home de la página por lo tanto en el resto de páginas funciona perfectamente el certificado.

El problema es del modulo, lo he localizado y solo existe un fichero con el nombre de "slideshow.tpl" y este es su contenido:

Código: php
<div class="row">
<div class="pos-slideshow col-md-offset-4 col-xs-12 col-md-8">
<div class="flexslider ma-nivoslider">
        <div class="pos-loading"></div>

            <div id="pos-slideshow-home" class="slides">

                {$count=0}
                {foreach from=$slides key=key item=slide}

                    {if $slide.link}<a href="{$slide.link}">{/if}<img style ="display:none" src="{$slide.image}"  data-thumb="{$slide.image}"  alt="" title="#htmlcaption{$slide.id_pos_slideshow}"  />{if $slide.link}</a>{/if}
   {/foreach}
            </div>
            {if $slideOptions.show_caption != 0}
                {foreach from=$slides key=key item=slide}
                    <div id="htmlcaption{$slide.id_pos_slideshow}" class="pos-slideshow-caption nivo-html-caption nivo-caption">
<div class="timethai" style="
position:absolute;
z-index:99;
top:0;
left:0;
background-color: rgba(49, 56, 72, 0.298);
height:5px;
-webkit-animation: myfirst {$slideOptions.pause_time}ms ease-in-out;
-moz-animation: myfirst {$slideOptions.pause_time}ms ease-in-out;
-ms-animation: myfirst {$slideOptions.pause_time}ms ease-in-out;
animation: myfirst {$slideOptions.pause_time}ms ease-in-out;

">
</div>

<!-- <div class="pos-slideshow-content ">
<div class="container">
{if $slide.title}
<div class="pos-slideshow-title">
   <h3>{$slide.title}</h3>
</div>
{/if}
<div class="pos_description">
{$slide.description}
</div>

{if $slide.link}
<div class="pos-slideshow-readmore">
<a href="{$slide.link}">{l s='Shop now' mod= 'posslideshow'}</a>
</div>
{/if}
</div>
</div> -->

                    </div>
                 {/foreach}
             {/if}
        </div>
    </div>
</div>
<script type="text/javascript">



    $(window).load(function() {
$(document).off('mouseenter').on('mouseenter', '.pos-slideshow', function(e){
$('.pos-slideshow .timethai').addClass('pos_hover');
});

$(document).off('mouseleave').on('mouseleave', '.pos-slideshow', function(e){
   $('.pos-slideshow .timethai').removeClass('pos_hover');
});
        $('#pos-slideshow-home').nivoSlider({
effect: '{if $slideOptions.animation_type != ''}{$slideOptions.animation_type}{else}random{/if}',
slices: 15,
boxCols: 8,
boxRows: 4,
animSpeed: '{if $slideOptions.animation_speed != ''}{$slideOptions.animation_speed}{else}600{/if}',
pauseTime: '{if $slideOptions.pause_time != ''}{$slideOptions.pause_time}{else}5000{/if}',
startSlide: {if $slideOptions.start_slide != ''}{$slideOptions.start_slide}{else}0{/if},
directionNav: {if $slideOptions.show_arrow != 0}{$slideOptions.show_arrow}{else}false{/if},
controlNav: {if $slideOptions.show_navigation != 0}{$slideOptions.show_navigation}{else}false{/if},
controlNavThumbs: false,
pauseOnHover: true,
manualAdvance: false,
prevText: '<i class="icon-angle-left"></i>',
nextText: '<i class="icon-angle-right"></i>',
                        afterLoad: function(){
                         $('.pos-loading').css("display","none");
                        },     
                        beforeChange: function(){
                            $('.bannerSlideshow1').removeClass("pos_in");
                            $('.bannerSlideshow2').removeClass("pos_in");
                            $('.bannerSlideshow3').removeClass("pos_in");
                        },
                        afterChange: function(){
                             $('.bannerSlideshow1').addClass("pos_in");
                            $('.bannerSlideshow2').addClass("pos_in");
                            $('.bannerSlideshow3').addClass("pos_in");
                        }
});
    });
</script>


¿Hay forma de obligarlo a usar HTTPS? He borrado las imágenes y he intentado forzarlo mediante .htaccess y las he vuelto a subir pero nada.

Saludos

Hola @No tienes permitido ver los links. Registrarse o Entrar a mi cuenta,

He usado bastante prestashop, y creeme que es mejor usar WooCommerce de Wordpress xD.
De todas formas, si las imágenes que has puesto en el slide estan hosteadas en el mismo server en el que está el prestashop, debería mostrarte el SSL de forma correcta. Si lo tienes hosteado en otro lado y le has puesto la URL de la imagen sin el https.. pues ahí está el problema.

En el código que adjuntas no se ve ningun armado de URL como para ver porque no le pone el ssl.

De igual forma, cuando entres al sitio, presiona F12 para abrir la consola del browser, te vas a la pestaña de consola y recarga la página, eso te dirá cual es el contenido mixto que está intentando cargar y con que URL.

Saludos,
ANTRAX


Hola @No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Gracias por la respuesta.
Desde el módulo en el panel de administración cuando se sube la imagen esta es alojada en la carpeta /img/ por lo tanto no puedo sustituir "HTTP" por "HTTPS", cosa que sí he hecho con otros enlaces.

El mensaje de consola es el siguiente

CitarMixed Content: The page at 'No tienes permitido ver los links. Registrarse o Entrar a mi cuenta' was loaded over HTTPS, but requested an insecure image 'No tienes permitido ver los links. Registrarse o Entrar a mi cuenta'. This content should also be served over HTTPS.

Lo dicho, solo puedo subir la imagen desde el panel de admin por lo tanto creo que se debería forzara que las imágenes dentro de "/tienda/img" las utilicé como HTTPS. Si escribo la URL con HTTPS en el navegador la imagen se visualiza correctamente pero claro es solo si copia URL y lo escribo en el navegador para posteriormente añadir la S al http.

Saludos

Bien.. Existe una forma "rustica" de ver por donde viene el problema.
Al parecer hay un archivo que es el que arma la URL de la imagen que la arma con HTTP y no con HTTPS.
Descargate todo el sitio completo y en una consola escribe:

grep -lir "http:"

Y te saldrán todos los archivos que tengan la palabra http: ahí podrás identificar cual es el archivo que está armando las URL con HTTP, solo le agregas la S y ya debería quedar.

Prueba y me avisas.

Saludos,
ANTRAX


Hola,
tengo el mismo problema de "mixed content" con unas imágenes de un par de módulos (el de logos y slider de la home) y buscando una solución he llegado hasta tu pregunta. Además y por el código que has puesto es del mismo desarrollador.

Por lo que he visto hasta el momento, no hay otra que ir a buscar el .tlp de cada modulo que genera error y localizar el código que busca las imagenes, algo que quería evitar en una instalación fresca.

Por cierto, para ver el mixed content que te da error: abre tu página con Chrome, botón derecha y selecciona "inspect" vete a la pestaña security, refresca y te aparecerá "Resources - mixed content" , dale a link inferior de "View "n" requests in Network Panel" y te saldrá el listado de imágenes que te dan error por entrar desde http