Codificación de URL en Plugin Outlets

Estoy intentando añadir un botón para compartir en LinkedIn a las insignias de una comunidad alojada en Discourse de la que soy administrador.

Para ello, estoy intentando usar este Plugin Outlet. Incluí el siguiente código en la sección head de un tema.

<script type='text/x-handlebars' data-template-name='/connectors/badge-contents-top/linkedin-button'>
  <a href="https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io{{@outletArgs.url}}" class="linkedin-share-button">
    <img src="https://download.linkedin.com/desktop/add2profile/buttons/en_US.png " alt="LinkedIn Add to Profile button">
  </a>
</script>

Por favor, ten en cuenta el atributo href: https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/{{@outletArgs.url}}.

El valor de @outletArgs.url se parece a https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>. Quiero centrarme en la parte username=<username>.

La URL no está codificada, el signo igual se está pasando literalmente, por lo que cuando el navegador procesa https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>, ignora =<username>.

¿Cómo codifico la URL aquí?

Lo manejé usando Discourse Theme CLI de la siguiente manera:

  • Creé un nuevo tema y lo convertí en un componente (ejecuté discourse_theme new y seguí las indicaciones).

  • En javascripts/discourse/connectors/badge-contents-top creé un archivo JavaScript con contenido no muy diferente a. . .

    import Component from "@glimmer/component";
    import { inject as service } from "@ember/service";
    
    export default class LinkedinButton extends Component {
      @service siteSettings;
    
      get encodedUrl() {
        return encodeURIComponent(this.args.outletArgs.url);
      }
    }
    
  • En el mismo directorio que el anterior, creé un archivo Handlebars que contiene aproximadamente el HTML interno de la etiqueta script en la pregunta.

    • Le di a este y al archivo anterior el mismo nombre, aparte de su terminación, es decir, para lo que valga.
1 me gusta

¿No veo una aplicación de esto? ¿Es redundante?

¡Sí! Gracias por darte cuenta.

1 me gusta

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.