23
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Qiitaの記事がSlackで展開されない理由

Last updated at Posted at 2018-04-10

Qiitaの記事URLをslackに貼ると、概要を自動で取得してプレビューを表示してくれます。
技術情報を共有する際に便利な機能ですが、中には展開されない記事もあるようです。
同じサイトなのになぜ?と思い、原因を調べてみました。

以下の記事は展開されます。

slack_展開.png

以下の記事は展開されません。

slack_展開されず.png

原因(推測)

結論から言うと、記事の冒頭にHTMLタグが含まれていると、展開してくれない仕様(バグ?)のようです。

slackにURLを含んだメッセージ送信すると、HTMLに含まれるmetaタグからOpenGraph情報を取得し、プレビューとして表示してくれます。

Qiitaの記事の場合は、

  • <meta content="..." property="og:title">
  • <meta content="..." property="og:description">

このへんの内容が展開表示の内容に使われています。

展開される記事のog:description

<meta content="Laravelにおいて、あるルートはAjaxの場合のみ通したい、
さらにphpunitでAjaxのルートもテストしたい、という状況が発生したため、
その方法を考えてみました。
(確認環境:Laravel5.4)

# Ajaxのみ許可..." property="og:description">

markdownとプレーンテキストのみ含まれます。

展開されない記事のog:description

<meta content="[AmazonSNS](https://aws.amazon.com/jp/sns/)とは、<b>Amazon</b>が提供するPUSH型通知サービスです。

多数のユーザーに対してメールやPUSH通知を送る以外に、
他のAWSサービ..." property="og:description">

<b>がcontentに含まれています。

<meta content="..." property="og:description">に採用される内容

Qiitaの投稿ページから概要を直接編集することはできません。
では何が概要として採用されるのでしょうか。
以下の記事によれば、
本文の先頭117文字が、概要として採用されるとのことでした。
https://qiita.com/suin/items/c2cdf9d51198bfb714b2

対策

というわけで、自動展開される記事にするには、
冒頭117文字にはHTMLタグを使わないようにする必要がありそうです。

どうしても装飾をしたい場合は、markdownを使いましょう。

続き:URLがSlackで展開されない理由

23
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
23
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?