Как кодировать URL для кнопок «Поделиться» в LinkedIn в Discourse

Разработка
1

Я пытаюсь добавить кнопку для публикации в LinkedIn к значкам в сообществе на Discourse, где я являюсь администратором.

Для этого я пытаюсь использовать этот Plugin Outlet. Я включил следующий код в секцию head темы.

<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>

Обратите внимание на атрибут href: https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/{{@outletArgs.url}}.

Значение @outletArgs.url выглядит примерно так: https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>. Я хочу сосредоточиться на части username=<username>.

URL не закодирован, знак равенства передается буквально, поэтому, когда браузер обрабатывает https://www.linkedin.com/profile/add?certUrl=https://community.my_community.io/https://community.my_community.io/badges/<badge_id>/<badge_name>?username=<username>, он игнорирует =<username>.

Как мне закодировать URL здесь?

2

Я решил эту задачу, используя Discourse Theme CLI следующим образом:

  • Создал новую тему и сделал её компонентом (выполнил команду discourse_theme new и следовал подсказкам).

  • В папке javascripts/discourse/connectors/badge-contents-top создал JavaScript-файл, содержимое которого примерно следующее: . . .

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

  • В той же директории создал файл Handlebars, который примерно содержит внутренний HTML из тега script в вопросе.

    • Я дал этому файлу и предыдущему одно и то же имя, за исключением расширения, то есть, на всякий случай.
3

Я не вижу применения этого? Это избыточно?

4

Да! Спасибо, что заметили это.