สำหรับนักพัฒนา Twitchat เปิดเผย API เพื่อรับกิจกรรมและควบคุมคุณสมบัติบางอย่างจากระยะไกล
อ่านเอกสารของมัน
/search
/announce message
สร้างไฟล์ data/credentials/credentials.json
และตั้งค่าเนื้อหาต่อไปนี้หลังจากกรอกค่า :
{
"server_port" : 3018 ,
"admin_ids" : [ " YOUR_TWITCH_USER_ID " ],
"csrf_key" : " " ,
"twitch_client_id" : " " ,
"twitch_client_secret" : " " ,
"twitch_redirect_uri" : " http://localhost:8080/oauth " ,
"twitch_scopes" : [
" chat:read+user:read:chat " ,
" chat:edit+user:write:chat " ,
" moderator:manage:announcements " ,
" moderator:manage:chat_messages " ,
" moderator:manage:shoutouts " ,
" whispers:read " ,
" user:manage:whispers " ,
" moderator:read:chatters " ,
" channel:read:redemptions " ,
" channel:manage:redemptions " ,
" channel:manage:polls " ,
" channel:manage:predictions " ,
" moderator:manage:chat_settings " ,
" channel:moderate " ,
" channel:manage:moderators " ,
" channel:manage:vips " ,
" channel:manage:raids " ,
" channel:manage:broadcast " ,
" channel:read:hype_train " ,
" channel:edit:commercial " ,
" channel:read:subscriptions " ,
" user:read:emotes " ,
" user:read:follows " ,
" moderator:read:followers " ,
" user:read:moderated_channels " ,
" user:read:blocked_users " ,
" user:manage:blocked_users " ,
" user:edit:broadcast " ,
" moderator:manage:banned_users " ,
" moderator:manage:automod " ,
" moderator:manage:shield_mode " ,
" moderator:manage:unban_requests " ,
" clips:edit " ,
" channel:read:ads " ,
" channel:manage:ads " ,
" moderator:manage:blocked_terms " ,
" moderator:manage:warnings " ,
" moderator:read:moderators " ,
" moderator:read:vips " ,
" moderator:read:suspicious_users " ,
" bits:read "
],
"spotify_client_id" : " " ,
"spotify_client_secret" : " " ,
"spotify_scopes" : " user-read-currently-playing user-modify-playback-state playlist-read-private playlist-modify-public playlist-modify-private " ,
"spotify_redirect_uri" : " http://localhost:8080/spotify/auth " ,
"patreon_client_id" : " " ,
"patreon_client_secret" : " " ,
"patreon_scopes" : " identity campaigns campaigns.members w:campaigns.webhook " ,
"patreon_redirect_uri" : " http://localhost:8080/patreon/auth " ,
"patreon_client_id_server" : " " ,
"patreon_client_secret_server" : " " ,
"patreon_redirect_uri_server" : " http://localhost:3018/api/patreon/serverauth " ,
"patreon_webhook_secret" : " " ,
"patreon_cipherKey" : " " , //64 chars
"tenor_secret" : " " ,
"youtube_key" : " path/to/key.json " ,
"youtube_scopes" : [ " https://www.googleapis.com/auth/youtube.readonly " , " https://www.googleapis.com/auth/youtube.force-ssl " ],
"google_key" : " path/to/key.json " ,
"paypal_client_id" : " " ,
"paypal_client_secret" : " " ,
"donors_remote_api_secret" : " " ,
"contact_mail" : " " ,
"discord_client_id" : " " ,
"discord_public_key" : " " ,
"discord_bot_token" : " " ,
"streamlabs_client_id" : " " ,
"streamlabs_client_secret" : " " ,
"streamlabs_redirect_uri" : " " ,
"streamelements_client_id" : " " ,
"streamelements_client_secret" : " " ,
"tipeee_client_id" : " " ,
"tipeee_client_secret" : " " ,
"tipeee_redirect_uri" : " http://localhost:8080/tipeee/auth " ,
"tiltify_client_id" : " " ,
"tiltify_client_secret" : " " ,
"tiltify_webhook_verify" : " " ,
"tiltify_webhook_id" : " " ,
"tiltify_redirect_uri" : " http://localhost:8080/tiltify/auth " ,
"tiltify_scopes" : " public webhooks:write " ,
"tiltify_api_path" : " https://v5api.tiltify.com "
}
สร้างแอปพลิเคชัน Twitch และกรอกค่า client_id
และ client_secret
เขียนสิ่งที่คุณต้องการลงในฟิลด์ csrf_key
ซึ่งจะใช้เพื่อรักษาความปลอดภัยการตรวจสอบสิทธิ์กระตุกจากการโจมตี CSRF
กำหนดค่า URI การเปลี่ยนเส้นทางของแอปพลิเคชัน Twitch ไปที่:
http://localhost:8080/oauth
(ปรับให้เข้ากับพอร์ตและโดเมนที่เหมาะสมหากใช้งานออนไลน์)
ตั้งค่าเดียวกันกับคุณสมบัติ redirect_uri
ของไฟล์ credentials.json
คุณยังสามารถสร้างแอปพลิเคชัน Spotify และกรอก Spotify spotify_client_id
และ spotify_client_secret
ตามค่าเริ่มต้น เซิร์ฟเวอร์จะรับฟังพอร์ต 3018 คุณสามารถเปลี่ยนได้ใน credentials.json
และ src_front/utils/Config.ts
โครงการนี้ได้รับการเข้ารหัสด้วย VSCode
ขอแนะนำให้ติดตั้งปลั๊กอินเหล่านี้:
ปลั๊กอิน Vue: https://marketplace.visualstudio.com/items?itemName=Vue.volar
ปลั๊กอิน I18n-ally: https://marketplace.visualstudio.com/items?itemName=lokalise.i18n-ally
npm install
npm run dev
npm run build
node server/boostrap.js
ต้องทำสิ่งต่อไปนี้ทั้งหมดบนโฟลเดอร์แยกจากโครงการ GIT
คอมไพล์โปรเจ็กต์และพุชเนื้อหาของ server
บนรูทเซิร์ฟเวอร์ของคุณ
ถัดจากไฟล์นี้ ให้สร้างโฟลเดอร์ public
และพุชเนื้อหาของโฟลเดอร์ dist
ในเครื่องของคุณเข้าไปข้างใน
เพิ่มโฟลเดอร์ credentials
ตัวภายใน data
ที่เก่ากว่าที่รากของโครงการ
สร้างไฟล์ env.conf
เพียงเขียน prod
เข้าไปข้างใน แล้วดันไปที่รูทของโปรเจ็กต์
ติดตั้งการพึ่งพาการผลิตทั้งหมดและรันเซิร์ฟเวอร์
นี่คือโครงสร้างไฟล์ที่คาดหวัง:
─ราก
├─ node_modules/
├─ สาธารณะ/
├─ ยูทิลิตี้/
├─ ข้อมูล/
├─ หนังสือรับรอง/
├─ คอนโทรลเลอร์/
├─ bootstrap.js
├─ env.conf
เพียงสร้างโฟลเดอร์ใหม่ภายใต้โฟลเดอร์ i18n
ด้วยรหัส ISO 639-1 ของภาษา
อ่านหัวข้อถัดไปเพื่อทราบวิธีแปลป้ายกำกับ
เพื่อให้การแปลเป็นภาษาท้องถิ่นง่ายที่สุดเท่าที่จะเป็นไปได้ เราได้จัดทำอินเทอร์เฟซเฉพาะที่แสดงรายการหมวดหมู่และป้ายกำกับที่มีอยู่ทั้งหมดซึ่งสามารถแก้ไขได้
การอัปเดตใดๆ บนอินเทอร์เฟซนี้จะกระตุ้นให้มีการสร้างไฟล์ที่คอมไพล์ขึ้นใหม่ รวมถึงการอัปเดตบนหน้า Twitchat ใดๆ ที่เปิดบนเบราว์เซอร์เดียวกัน
อินเทอร์เฟซสามารถเข้าถึงได้โดยผู้ดูแลระบบเท่านั้นและสามารถพบได้ที่นี่:
localhost:8080/ป้ายกำกับ
หากต้องการรับสิทธิ์ผู้ดูแลระบบ คุณต้องตั้งค่า ID ผู้ใช้ Twitch ของคุณภายใต้อาร์เรย์ admin_ids
ในไฟล์ credentials.json
หากต้องการเพิ่มป้ายกำกับใหม่ คุณจะต้องแก้ไขแหล่งที่มา JSON
ไฟล์ป้ายกำกับทั้งหมดสามารถพบได้ในโฟลเดอร์ i18n
พวกเขาจะแบ่งตามภาษาแล้วตามส่วน
คุณสามารถเพิ่มโครงสร้างไฟล์หรือโฟลเดอร์ใหม่ได้
สิ่งเหล่านี้ทั้งหมดจะรวมกันเป็น static/labels.json
ในระหว่างกระบวนการสร้าง
ไฟล์สามารถมีชื่อใดก็ได้ แต่ป้ายกำกับทั้งหมดภายในนั้นจะต้องอยู่ภายใต้คุณสมบัติเดียวซึ่งจะเป็นเส้นทางพื้นฐานในการใช้ป้ายกำกับ ชื่อคุณสมบัติมักจะเหมือนกับชื่อไฟล์
ตัวอย่าง:
─ en
├─ global.json
├─ home.json/
├─ triggers.json/
ตัวอย่าง global.json
:
{
"global" :{
"hello" : " World "
}
}
ตัวอย่าง home.json
:
{
"home" :{
"lorem" : " ipsum dolor sit amet "
}
}
สิ่งนี้จะส่งออกไฟล์ JSON นี้:
{
"en" :{
"global" :{
"hello" : " World "
},
"hello" :{
"lorem" : " ipsum dolor sit amet "
}
}
}
รันคำสั่งต่อไปนี้:
npm run streamdeck_package
ปลั๊กอินที่คอมไพล์แล้วจะอยู่ที่ streamdeck_plugin/fr. Twitchat .streamDeckPlugin
.