ホームページ > ウェブフロントエンド > jsチュートリアル > ユナイテッドについて言及...ゴー

ユナイテッドについて言及...ゴー

Linda Hamilton
リリース: 2024-10-04 20:23:30
オリジナル
833 人が閲覧しました

ブログとは、自分の意見を公に発表することを意味します。もちろん、それに対する反応を期待します。そうでない場合は、自分の考えを小さなノートに書いて、ベッドサイドのテーブルに隠しておきます。したがって、ブログ投稿は常に、仲間、読者、Web ユーザーとの会話の前半にすぎません。残りの半分は反応、またはさらに良いのは相互作用で構成されます。意見を広めたり議論したりするために、自分のブログ投稿でその意見を取り上げた他のブロガーからの「いいね!」、コメント、またはリンク。この 2 つの部分から物語が生まれます。

ブログの人気が再び高まっているようです。情報の共有が容易になった大規模な「意見企業」によって長年囲い込まれてきた後、多くの人は、意見そのものや個人さえも注目されることがなかったため、この単純さには代償が伴うことに気づいています。閉じたネットワークの中心にあるコンテンツは、収益化されたり、他のネットワークを操作するために使用されます。今日、ブログは、自由と独立、そして大規模なソーシャル メディア プラットフォームからの解放への欲求の表現でもあります。

ただし、この自由は、かなりの技術的理解が必要であり、コンテンツのリンクは、キーボードを使用できればよい大手プラットフォームほど簡単ではないことも意味します。 Wordpress などのブログ プラットフォームはこの時点では確かに役立ちますが、結局のところ、自分の考えを書き留めて投稿の形で公開できるブログがあるだけで、自動的に会話になるわけではありません。ブログを介した実際の会話の最も重要な構成要素は、World Wide Web の中心要素であるハイパーリンクです。そして、ブログの黎明期である 2000 年代とは対照的に、現在では、リンクを介してコミュニケーションし、単にブログ投稿にコメントする以上のやり取りを行う方法が数多くあります。

インタラクション

例: アリスはブログに投稿を書きます...

  1. ボブはそれを読み、そのトピックについてブログに書き、その URL でアリスの投稿に言及します。
  2. アリスは、見出しを含む投稿の URL をマストドンなどのソーシャル Web プラットフォームに投稿します。 Chris は投稿を読み、「いいね!」を押します
  3. ダニエルはマストドンの投稿に返信し、同時に再投稿します
  4. Alice は、オリジナルの URL を含む完全な投稿を DEV などの開発者プラットフォームにシンジケートし、Eric はこの投稿にコメントします

上記のやり取りはすべて、Alice のブログから始まりましたが、彼女のシステムの外部で行われ、元の投稿には反映されません。ボブは確かにエリックのコメントやダニエルの返信を興味深いと思うでしょうが、アリスがブログでボブが言及していることを知らないのと同じくらい、彼もそれらに気づいていません。ウェブからのすべてのインタラクションのリストが元の投稿にありません。

これらすべてを達成するための技術はすでに存在します。必要なのは実践することだけです:

on 1: ボブは投稿ページ (例: webmention.io) でアリスによってリンクされたエンドポイントに Webmention を送信し、Alice は API 経由で Webmention をそこで取得します
2 と 3: アリスは以前に brid.gy をセットアップして、Mastodon インタラクションを Webmention エンドポイントにも配信しました
4: アリスは専用 API 経由で DEV コメントを取得します

ソーシャル ウェブ、別名 Fediverse からのやり取りは、今日すでにさまざまなブログ投稿で見ることができます。これらは通常、Mastodon の API からページに直接プルされます。ただし、これでは通常、重要な側面の 1 つが無視されます。元の投稿への自己実行シンジケーションのリンク。これは、読者にワンクリックでインタラクション オプションに到達する機会を与えるためです。

しかし、Alice は、それぞれの API に慣れていなくても、どうやってページ上のインタラクションを取得できるのでしょうか?

彼女は単に Mentions United プロジェクトのクライアント スクリプトを使用しているだけです ...

推進力

3 年前、私はこのブログで Webmentions を紹介し、あちこちでそれについて書いただけでなく、他のプラットフォームでの手動シンジケーションを体系的に記録し、投稿の下に表示することも始めました。
私はテキスト投稿を Mastodon にシンジケートし、コンテンツが適切であれば DEV に、写真を Pixelfed、Flickr、およびその他の (残念ながら) いくつかのクローズド プラットフォームにシンジケートします。私は、Aaron Parecki の webmention.io と Ryan Barrett の brid.gy を組み合わせて、Mastodon と Flickr からすべての Webmention とインタラクションを収集し、クライアント側 JavaScript を使用して投稿ページにそれらを表示しました。

しかし常に欠けていたのは、他のプラットフォームからのインタラクションでした。 brid.gy は原則として、ソーシャル ウェブ最大の写真プラットフォームである Pixelfed からいいねやコメントを収集できますが、このプラットフォームでは 4 年前から知られているいくつかのバグがこれを妨げています。

Sekarang, saya bukan orang yang paling sabar, dan memandangkan tiada maklum balas walaupun selepas pertanyaan berulang dalam isu Pixelfed, dan ia hanya akan menyelesaikan satu masalah untuk saya, saya fikir sendiri: maka saya akan cuma bina sendiri sesuatu yang mampu mengambil interaksi daripada semua API yang mungkin dan memasukkannya ke dalam halaman siaran saya.

Projek «Mentions United»

Seperti yang Robb Knight katakan tentang EchoFeednya:

Menamakan perkara itu sukar, tinggalkan saya sendiri.

Kefungsian dan struktur penyelesaian lebih mudah untuk ditentukan. Di satu pihak, ia adalah untuk menjadi aplikasi JavaScript pelanggan tulen yang berjalan dalam penyemak imbas pada halaman untuk memastikan bahawa data sentiasa terkini dan interaksi yang ditarik balik tidak diambil kira. Sebaliknya, sistem pemalam seharusnya hanya melaksanakan skrip yang diperlukan sahaja.

Oleh itu, projek ini terdiri daripada skrip utama hanya 7 KB dan dua jenis skrip pemalam:

  • Pemalam penyedia untuk mendapatkan semula data interaksi berkaitan orang dan meletakkannya dalam bentuk biasa

  • Pemalam Renderer untuk mengubah data yang dikumpul menjadi HTML dan memasukkannya ke dalam halaman

Skrip utama (mentions-united.js) melaksanakan kaedah berkaitan berikut:

  • daftar(plugin) - Mendaftarkan skrip pemalam untuk pelaksanaan
  • load() - Laksanakan kaedah retrieve() dalam semua pemalam penyedia berdaftar, yang mengumpul data daripada API masing-masing
  • show() - Laksanakan kaedah pemaparan(interaksi) dalam semua pemalam pemapar berdaftar, yang menukar data yang digabungkan menjadi HTML dan memasukkannya

Penjelasan lanjut tentang cara penyelesaian distrukturkan boleh didapati dalam README repo GitHub.

Pemalam yang tersedia

Pemalam yang dibangunkan pada mulanya secara semula jadi memenuhi keperluan saya untuk blog ini, tetapi alangkah baiknya jika dari semasa ke semasa lebih banyak daripada komuniti pembangun akan ditambahkan. Saya akan menyumbang pemalam penyedia asli untuk Mastodon dan Flickr dalam beberapa minggu akan datang untuk mengurangkan pergantungan semasa pada brid.gy, di mana ia tidak lagi diperlukan.

  • Pemalam-Pembekal Sebutan Web (mention-united-provider_webmentions.js)
    Dapatkan semua interaksi daripada webmention.io API melalui URL catatan blog (sasaran), sama ada webmention sebenar atau interaksi daripada platform Mastodon, Bluesky, GitHub, Flickr dan lain-lain yang telah disepadukan melalui brid.gy

  • Penyedia-Pemalam Pixelfed (menyebut-united-provider_pixelfed.js)
    Dapatkan semua interaksi daripada API tika Pixelfed melalui URL pensindiketan (sumber). Dalam pilihan yang diluluskan, anda juga boleh menentukan URL proksi API untuk menghalang kunci yang diperlukan untuk mendapatkan semula daripada tersedia secara umum.

  • Penyedia-Pemalam DEV.to (menyebut-united-provider_devto.js)
    Dapatkan semua ulasan daripada API DEV melalui URL pensindiketan

Mentions United ... Go

Setelah semua interaksi telah dikumpulkan, pemalam pemapar boleh menyepadukannya ke dalam halaman dengan cara yang berbeza. Adalah penting untuk ambil perhatian bahawa penyelesaian mengeluarkan HTML tulen tanpa sebarang gaya, kerana ini adalah sangat individu selepas semua.

  • Renderer-Plugin Senarai (mention-united-renderer_list.js)
    Menghasilkan senarai diisih menurun bagi semua interaksi

  • Renderer-Plugin Avatar mengikut Jenis (menyebut-united-renderer_avatars-by-type.js)
    Menjana senarai sebaris avatar untuk semua interaksi jenis tertentu, contohnya Suka

  • Renderer-Plugin Jumlah Nombor (menyebut-united-renderer_total-number.js)
    Mencipta sauh dengan bilangan interaksi

Maklumat tambahan tentang pemalam, pilihan dan banyak lagi butiran boleh didapati di repositori GitHub untuk projek itu.


Pada siaran asal di kiko.io saya memberikan gambaran bagaimana pelaksanaan saya kelihatan di bawah SSG Hexo ... https://kiko.io/post/Mentions-United-3-2-1-go/

以上がユナイテッドについて言及...ゴーの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート