{"id":25316,"date":"2024-04-26T20:49:06","date_gmt":"2024-04-26T11:49:06","guid":{"rendered":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25316"},"modified":"2024-04-26T20:49:08","modified_gmt":"2024-04-26T11:49:08","slug":"slack%e9%a2%a8%e3%83%81%e3%83%a3%e3%83%83%e3%83%88%e3%83%9c%e3%83%83%e3%83%88%e3%82%b5%e3%82%a4%e3%83%88","status":"publish","type":"post","link":"http:\/\/www.tyosuke20xx.com\/blog\/?p=25316","title":{"rendered":"Slack\u98a8\u30c1\u30e3\u30c3\u30c8\u30dc\u30c3\u30c8\u30b5\u30a4\u30c8"},"content":{"rendered":"\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html lang=\"en\">\n&lt;head>\n    &lt;meta charset=\"UTF-8\">\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    &lt;title>Slack\u98a8\u30c1\u30e3\u30c3\u30c8\u30dc\u30c3\u30c8&lt;\/title>\n    &lt;style>\n        body {\n            font-family: Arial, sans-serif;\n            margin: 0;\n            padding: 0;\n        }\n\n        .chat-container {\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            height: 100vh;\n        }\n\n        .chat-window {\n            width: 400px;\n            background-color: #f4f4f4;\n            border: 1px solid #ddd;\n            border-radius: 5px;\n            padding: 20px;\n        }\n\n        .chat-messages {\n            height: 300px;\n            overflow-y: auto;\n            border-bottom: 1px solid #ddd;\n            margin-bottom: 10px;\n        }\n\n        #message-input {\n            width: 100%;\n            padding: 10px;\n            border: 1px solid #ddd;\n            border-radius: 5px;\n            margin-bottom: 10px;\n        }\n\n        button {\n            padding: 10px 20px;\n            background-color: #007bff;\n            color: #fff;\n            border: none;\n            border-radius: 5px;\n            cursor: pointer;\n        }\n\n        button:hover {\n            background-color: #0056b3;\n        }\n    &lt;\/style>\n&lt;\/head>\n&lt;body>\n    &lt;div class=\"chat-container\">\n        &lt;div class=\"chat-window\">\n            &lt;div class=\"chat-messages\" id=\"chat-messages\">\n                &lt;!-- \u30c1\u30e3\u30c3\u30c8\u30e1\u30c3\u30bb\u30fc\u30b8\u304c\u8868\u793a\u3055\u308c\u308b\u90e8\u5206 -->\n            &lt;\/div>\n            &lt;input type=\"text\" id=\"message-input\" placeholder=\"\u30e1\u30c3\u30bb\u30fc\u30b8\u3092\u5165\u529b\u3057\u3066\u304f\u3060\u3055\u3044...\">\n            &lt;button onclick=\"sendMessage()\">\u9001\u4fe1&lt;\/button>\n        &lt;\/div>\n    &lt;\/div>\n\n    &lt;script>\n        function sendMessage() {\n            var messageInput = document.getElementById('message-input');\n            var message = messageInput.value.trim();\n\n            if (message !== '') {\n                var chatMessages = document.getElementById('chat-messages');\n                var messageElement = document.createElement('div');\n                messageElement.textContent = message;\n                chatMessages.appendChild(messageElement);\n                messageInput.value = '';\n\n                \/\/ \u30e1\u30c3\u30bb\u30fc\u30b8\u3092\u30d0\u30c3\u30af\u30a8\u30f3\u30c9\u306b\u9001\u4fe1\n                fetch('\/send_message', {\n                    method: 'POST',\n                    headers: {\n                        'Content-Type': 'application\/json'\n                    },\n                    body: JSON.stringify({ message: message })\n                });\n            }\n        }\n    &lt;\/script>\n&lt;\/body>\n&lt;\/html>\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[6],"tags":[16],"class_list":["post-25316","post","type-post","status-publish","format-standard","hentry","category-web","tag-webdev"],"aioseo_notices":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25316","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=25316"}],"version-history":[{"count":1,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25316\/revisions"}],"predecessor-version":[{"id":25317,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/25316\/revisions\/25317"}],"wp:attachment":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=25316"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=25316"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=25316"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}