Codificação de URL em Plugin Outlets

Dev
1

Estou tentando adicionar um botão de compartilhamento do LinkedIn aos emblemas em uma comunidade hospedada pelo Discourse em que sou administrador.

Para isso, estou tentando usar este Plugin Outlet. Incluí o seguinte código na seção head de um 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>

Observe o atributo href: https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/{{@outletArgs.url}}.

O valor de @outletArgs.url se parece com https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>. Quero focar na parte username=<username>.

A URL não está codificada, o sinal de igual está sendo passado literalmente, então quando o navegador processa https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>, ele ignora =<username>.

Como codifico a URL aqui?

2

Eu lidei com isso usando o Discourse Theme CLI da seguinte forma:

  • Criei um novo tema e o transformei em um componente (executei discourse_theme new e segui as instruções).

  • Em javascripts/discourse/connectors/badge-contents-top, criei um arquivo JavaScript com conteúdo não muito diferente de. . .

    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);
  }
}

  • No mesmo diretório acima, criei um arquivo Handlebars que contém aproximadamente o HTML interno da tag script na pergunta.

    • Dei a este e ao arquivo anterior o mesmo nome, exceto pela terminação, ou seja, para o que vale.
1 curtida
3

Não vejo aplicação para isso? É redundante?

4

Sim! Obrigado por perceber isso.

1 curtida
5

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