URL encoding في Plugin Outlets

أحاول إضافة زر مشاركة على LinkedIn إلى شارات في مجتمع مستضاف بواسطة Discourse أنا مسؤول فيه.

لهذا الغرض، أحاول استخدام منفذ المكون الإضافي هذا. لقد قمت بتضمين الكود التالي في قسم الرأس (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 هنا؟

لقد تعاملت مع هذا باستخدام 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 الداخلي من علامة النص البرمجي في السؤال.

    • أعطيت هذا الملف والملف السابق نفس الاسم، بخلاف نهايتهما، أي، على ما يستحق.
إعجاب واحد (1)

لا أرى تطبيقًا لهذا؟ هل هو زائد عن الحاجة؟

نعم! شكراً لك على اكتشاف ذلك.

إعجاب واحد (1)

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