แชร์ผ่าน

สร้างและปรับใช้เว็บแอป Azure ต้นแบบ

  • บทความ

หากต้องการสร้างและปรับใช้เว็บแอป Azure ต้นแบบ คุณต้องสร้างและปรับใช้เว็บแอป Backend และ frontend บทช่วยสอนนี้จะให้คําแนะนําสําหรับการสร้างและการปรับใช้แอป backend และ frontend ของต้นแบบ

ตรวจสอบให้แน่ใจว่าคุณได้ตรวจทานบทช่วยสอนการตั้งค่าระบบคลาวด์ของปริมาณงานก่อนที่คุณจะปรับใช้เว็บแอป Backend และ frontend ของคุณ

สร้างและปรับใช้เว็บแอป backend ต้นแบบ

  1. ใน พอร์ทัล Azure สร้าง ทรัพยากรเว็บแอป

  2. ป้อนหรือเลือกข้อมูลที่เกี่ยวข้อง

    • สําหรับ เผยแพร่ เลือก โค้ด
    • สําหรับสแตกรันไทม์ ให้เลือก .NET 7 (STS) และ Windows

สําหรับคําแนะนําทั่วไป ดูเริ่มต้นใช้งาน Azure App Service

แมปโดเมนของคุณไปยังเว็บแอป Backend

  1. ไปที่ตั้งค่า>โดเมนแบบกําหนดเอง

  2. เลือก เพิ่มโดเมนแบบกําหนดเอง แล้วทําตามคําแนะนํา

    สําหรับข้อมูลเพิ่มเติม ดูการแมปโดเมนแบบกําหนดเองใน Azure

  3. ใน Visual Studio ให้เปิดโซลูชันหม้อน้ํา Backend ของคุณ

  4. คลิกขวาที่โครงการต้นแบบและเลือกเผยแพร่

  5. สําหรับเป้าหมาย เลือก Azure

  6. ลงชื่อเข้าใช้ด้วยผู้ใช้ที่มีสิทธิ์เข้าถึงเว็บแอป Azure ที่คุณสร้างขึ้น

  7. ใช้ UI เพื่อค้นหาการสมัครใช้งานที่เกี่ยวข้องและกลุ่มทรัพยากร จากนั้นทําตามคําแนะนําเพื่อเผยแพร่

อัปเดต CORS

  1. ในบานหน้าต่างภาพรวมของเว็บแอปของคุณในพอร์ทัล Azure ให้ไปที่ API>CORS
  2. ภายใต้ อนุญาตจุดเริ่มต้น เพิ่ม URL ของเว็บแอป frontend ของคุณ

สร้างและปรับใช้แอป frontend ของเว็บต้นแบบ

  1. ใน พอร์ทัล Azure สร้าง ทรัพยากรเว็บแอป

  2. ป้อนหรือเลือกข้อมูลที่เกี่ยวข้อง

    • สําหรับ เผยแพร่ เลือก โค้ด
    • สําหรับสแตกรันไทม์ ให้เลือก Node 18 LTS และ Windows

สําหรับคําแนะนําทั่วไป ดูเริ่มต้นใช้งานด่วนสําหรับ Node.js ใน Azure App Service

แมปโดเมนของคุณไปยังเว็บแอป frontend

  1. ไปที่ตั้งค่า>โดเมนแบบกําหนดเอง
  2. เลือก เพิ่มโดเมนแบบกําหนดเอง แล้วทําตามคําแนะนํา

สําหรับข้อมูลเพิ่มเติม ดูการแมปโดเมนแบบกําหนดเองใน Azure

เผยแพร่เว็บแอป frontend boilerplate ของคุณ

  1. สร้างหม้อน้ํา frontend ของคุณโดยการ npm run build:testเรียกใช้
  2. ไปที่โฟลเดอร์ Microsoft-Fabric-developer-sample\Frontend\tools\dist
  3. เลือกไฟล์ทั้งหมดและโฟลเดอร์แอสเซทภายใต้ distและสร้างไฟล์.zip ของไฟล์ที่เลือก
  4. เปิด PowerShell
  5. ใน PowerShell ให้เรียกใช้ Connect-AzAccount และลงชื่อเข้าใช้ด้วยผู้ใช้ที่มีสิทธิ์เข้าถึงเว็บแอป Azure ที่คุณสร้างขึ้น
  6. เรียกใช้Set-AzContext -Subscription "<subscription_id>"
  7. เรียกใช้Publish-AzWebApp -ResourceGroupName <resource_group_name> -Name <web_app_name> -ArchivePath <zip_file_path>