ブログ運営 on kenji.blog

Wie man eine Nachricht in Slack mit Slack App + OAuth2 postet

Wed, 16 Jul 2025 23:36:27 +0900

✅ Methode zum Posten mit einem Access Token (Slack Web API)

Das “OAuth Token” (wie xoxb-…) von Slack ist ein Schlüssel, um Nachrichten über die Web API von Slack zu posten. In diesem Fall senden Sie im Gegensatz zu einem Webhook eine POST-Anfrage an den Slack API-Endpunkt mit einem Authorization: Bearer-Header.

🔑 Notwendige Voraussetzungen

Sie müssen chat:write in den OAuth-Scopes der Slack-App aufnehmen:

Einrichtungsprozess

Gehen Sie zu https://api.slack.com/apps
Erstellen Sie eine App oder wählen Sie eine bestehende aus
Unter “OAuth & Permissions” > Scopes → Fügen Sie chat:write hinzu
Klicken Sie auf “Install to Workspace” oder “Reinstall” und holen Sie sich das Access Token (z.B. xoxb-xxxxxxxxxx)

💻 C++ Code (Posten in der Slack API mit WinHTTP)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72


#include <windows.h>
#include <winhttp.h>
#include <iostream>

#pragma comment(lib, "winhttp.lib")

bool PostSlackMessage(const std::wstring& accessToken, const std::string& channel, const std::string& text) {
 const wchar_t* host = L"slack.com";
 const wchar_t* path = L"/api/chat.postMessage";

 HINTERNET hSession = WinHttpOpen(L"SlackPoster/1.0",
 WINHTTP_ACCESS_TYPE_DEFAULT_PROXY,
 WINHTTP_NO_PROXY_NAME,
 WINHTTP_NO_PROXY_BYPASS, 0);
 if (!hSession) return false;

 HINTERNET hConnect = WinHttpConnect(hSession, host, INTERNET_DEFAULT_HTTPS_PORT, 0);
 if (!hConnect) return false;

 HINTERNET hRequest = WinHttpOpenRequest(hConnect, L"POST", path,
 NULL, WINHTTP_NO_REFERER,
 WINHTTP_DEFAULT_ACCEPT_TYPES,
 WINHTTP_FLAG_SECURE);

 // Authorization-Header und Content-Type
 std::wstring headers = L"Content-Type: application/json\r\n";
 headers += L"Authorization: Bearer " + accessToken + L"\r\n";

 // JSON-Body
 std::string body = R"({"channel":")" + channel + R"(","text":")" + text + R"("})";

 BOOL result = WinHttpSendRequest(hRequest,
 headers.c_str(),
 (DWORD)-1,
 (LPVOID)body.c_str(),
 body.length(),
 body.length(),
 0);

 if (!result || !WinHttpReceiveResponse(hRequest, NULL)) {
 std::cerr << "Sende-Fehler\n";
 return false;
 }

 // Überprüfung des Statuscodes
 DWORD statusCode = 0;
 DWORD size = sizeof(statusCode);
 WinHttpQueryHeaders(hRequest,
 WINHTTP_QUERY_STATUS_CODE | WINHTTP_QUERY_FLAG_NUMBER,
 WINHTTP_HEADER_NAME_BY_INDEX,
 &statusCode, &size, WINHTTP_NO_HEADER_INDEX);

 WinHttpCloseHandle(hRequest);
 WinHttpCloseHandle(hConnect);
 WinHttpCloseHandle(hSession);

 return (statusCode == 200);
}

int main() {
 std::wstring token = L"xoxb-dein_access_token"; // Access Token
 std::string channel = "KANAL_ID_oder_#general"; // Z.B.: "#general" oder "C0123456789"
 std::string message = "Test zum Posten in Slack mit C++!";

 if (PostSlackMessage(token, channel, message)) {
 std::cout << "Erfolgreich gepostet!\n";
 } else {
 std::cerr << "Posten fehlgeschlagen.\n";
 }

 return 0;
}

📌 Wie man die Kanal-ID erhält

Die alleinige Verwendung des Kanalnamens (z.B. #general) kann zu einem Fehler führen. Die zuverlässige Methode besteht darin, die ID zu verwenden, die in der URL der Slack-Kanalseite steht.

1
2


https://app.slack.com/client/Txxxxx/C0123456789
 ↑Dieser Teil ist die Kanal-ID

✅ Über Token-Arten (Ergänzung)

Token-Format	Verwendung	Beispiel
`xoxb-...`	Bot Token (Empfohlen)	Posten, Bearbeiten, Löschen
`xoxp-...`	User Token (Nicht empfohlen)	Nicht-Bot-bezogene Vorgänge
Refresh Token	Für langfristige Token-Erneuerung	Wird normalerweise nicht verwendet

📝 Zusammenfassung

Um von C++ aus auf Slack zu posten, ist die Methode Slack Web API + Bearer Token zuverlässig
Verwenden Sie den chat.postMessage-Endpunkt mit HTTPS POST
Das Token muss im Bearer-Header gesendet werden
Die Angabe der Kanal-ID ist zuverlässig

Bildlayout in PaperMod ändern

Sun, 11 Sep 2022 18:50:40 +0900

Das Standardlayout zentriert das Bild mit einer Breite von 100 %, aber da es mir manchmal etwas zu groß vorkam, habe ich versucht, das Bild unter dem Titel umfließen zu lassen, und die Breite auf etwa 150px geändert.

Die Änderungen an den Dateien sind wie folgt.

blank.css

Um Ränder, Bildgröße und Textanzeigezeilen zu ändern, fügen Sie die folgende Beschreibung in blank.css hinzu.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23


.entry-content {
 -webkit-line-clamp: 4;
}

.entry-footer {
 text-align: right;
}

.entry-cover {
 margin-bottom: initial;
 text-align: center;
}

.entry-cover img {
 border-radius: 4px;
 display: inline;
 max-width: 100%;
}

.post-meta {
 display: block;
 text-align: right;
}

post-entry.css

Da ich die Definition in blank.css nicht löschen konnte, habe ich 1 Zeile an der folgenden Stelle in post-entry.css gelöscht.

1
2
3
4
5
6


.entry-cover img {
 border-radius: var(--radius);
 pointer-events: none;
 /* width: 100%; */ ← Diese Zeile löschen
 height: auto;
}

list.html

Um das Bildlayout zu ändern, habe ich die folgende Stelle in list.html geändert.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29


<article class="{{ $class }}">
 <!-- {{- $isHidden := (site.Params.cover.hidden | default site.Params.cover.hiddenInList) }} --><!-- Nach unten verschoben -->
 <!-- {{- partial "cover.html" (dict "cxt" . "IsHome" true "isHidden" $isHidden) }} --><!-- Nach unten verschoben -->
 <header class="entry-header">
 <h2>
 {{- .Title }}
 {{- if .Draft }}<sup><span class="entry-isdraft">&nbsp;&nbsp;[draft]</span></sup>{{- end }}
 </h2>
 </header>
 <div style="display:flex;"><!-- Hinzugefügt -->
 <div style="max-width:150px;margin:11px 15px 0px 0px;"><!-- Hinzugefügt -->
 {{- $isHidden := (site.Params.cover.hidden | default site.Params.cover.hiddenInList) }}<!-- Von oben verschoben -->
 {{- partial "cover.html" (dict "cxt" . "IsHome" true "isHidden" $isHidden) }}<!-- Von oben verschoben -->
 </div><!-- Hinzugefügt -->
 <div style="width:100%;"><!-- Hinzugefügt -->
 {{- if (ne (.Param "hideSummary") true) }}
 <div class="entry-content">
 <p>{{ .Summary | plainify | htmlUnescape }}{{ if .Truncated }}...{{ end }}</p>
 </div>
 {{- end }}
 {{- if not (.Param "hideMeta") }}
 <footer class="entry-footer">
 {{- partial "post_meta.html" . -}}
 </footer>
 {{- end }}
 <a class="entry-link" aria-label="post link to {{ .Title | plainify }}" href="{{ .Permalink }}"></a>
 </div><!-- Hinzugefügt -->
 </div><!-- Hinzugefügt -->
</article>

Es scheint, dass es nicht wenige ähnliche Anfragen gibt.

https://github.com/adityatelange/hugo-PaperMod/discussions/159#discussioncomment-247844

Es wäre toll, wenn die offiziellen Entwickler dies ebenfalls unterstützen könnten.

So konfigurieren Sie Twitter Card mit PaperMod

Sat, 10 Sep 2022 18:41:22 +0900

Einführung

Das PaperMod-Theme unterstützt Twitter Card. Die Einstellungen für Twitter Card müssen jedoch in der config.toml oder in den Header-Informationen der *.md jedes Artikels geschrieben werden. Wenn Sie es sowohl in jedem Artikel als auch in der config.toml konfigurieren, haben die Header-Informationen jedes Artikels Vorrang.

Konfiguration

config.toml

Fügen Sie in config.toml ein Element namens images unter [params] hinzu. Beschreiben Sie in images den Pfad des Bildes, das auf Twitter Card angezeigt werden soll. Wenn Sie das Bild im Ordner static platzieren, reicht es aus, nur den Dateinamen anzugeben.

1
2


[params]
 images = ["twitter_card.jpg"]

Ordnerstruktur

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


root
│ config.toml (Hier schreiben)
├─content
│ └─posts
│ └─Artikelordner
│ │ index.md (Hier schreiben)
│ └─images
│ cover.png (Hier platzieren)
└─static
 twitter_card.jpg (Hier platzieren)

Header-Informationen jedes Artikels

Fügen Sie in den Header-Informationen jedes Artikels ein Element namens image unter cover hinzu. Wenn Sie relative auf true setzen, können Sie es mit einem relativen Pfad von der *.md des Artikels aus angeben.

1
2
3


cover:
 image: "images/cover.jpg"
 relative: true

Wenn Sie es nicht oben im Artikel anzeigen möchten

Wenn Sie das Titelbild nicht oben im Artikel anzeigen möchten, fügen Sie ein Element namens hidden unter cover hinzu und setzen Sie es auf true.

1
2
3
4


cover:
 image: "images/cover.jpg"
 relative: true
 hidden: true

Über die Bildgröße

In der aktuellen PaperMod-Spezifikation scheint die Twitter Card-Größe nur summary_large_image zu unterstützen. Für die geeignete Größe (Auflösung) von summary_large_image gibt es verschiedene Theorien, aber etwa 800 x 418 (Bildverhältnis 1.91:1) scheint gut zu sein.

Referenzseite 1 Referenzseite 2

Wenn möglich, empfehlen wir, die Bildgröße vor dem Posten zu ändern.

So überprüfen Sie die Einstellungen

Verwenden Sie den Twitter Card Validator, um die Twitter Card-Einstellungen zu überprüfen. Da die Vorschau in meiner Umgebung jedoch nicht richtig angezeigt wurde, empfehle ich Ihnen, falls die Vorschau nicht angezeigt wird, sie vor dem Posten einmal mit einem privaten Konto oder Ähnlichem zu überprüfen.