Tag: IIS

  • แก้ปัญหาการเรียกใช้ font ผ่าน css แล้วเกิด error Access to font at has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

    sirapat.s

    เนื่องด้วยทางทีมงานต้องการใช้ font ผ่าน css ที่อยู่คนละที่ โดยต้องการให้ไปเรียกที่เดียวเพื่อการจัดการง่าย แต่ปัญหาก็เกิดขึ้น เพราะทางต้นทางมีการ block ไม่ให้เข้าถึง วันนี้จึงมีแนวทางการแก้ปัญหาดังนี้

    ขั้นตอนที่ 1 ไปตั้งค่าไฟล์ font ที่ต้องการ โดยในที่นี้ เป็น folder fonts โดยไปที่ IIS เลือก folder ที่ต้องการ จากนั้นเลือกเมนู “HTTP Response Headers” จากนั้น กด “Add” ดังรูป

    ขั้นตอนที่ 2 เพิ่ม Name: Access-Control-Allow-Origin และ Value: * ดังรูป

    ขั้นตอนที่ 3 ผลลัพธ์จากการเพิ่ม Name: Access-Control-Allow-Origin และ Value: * ดังรูป

    ขั้นตอนที่ 4 เพิ่ม Name: Access-Control-Allow-Origin และ Value: * ที่ไฟล์ font.css ด้วยเหมือนกัน

    ขั้นตอนที่ 5 ปรับแก้การเรียกใช้ css โดยใช้ SRI Hash Generator ผ่าน SRI Hash Generator

    ขั้นตอนที่ 6 เวบไซต์ปลายทางก็จะสามารถเรียกใช้ font จาก เวบไซต์ต้นทาง ดังรูป

    หวังว่าจะเป็นประโยชน์ให้กับคนที่มีปัญหาแบบเดียวกันนี้นะคะ

    ที่มา

  • การติดตั้งเว็บไซต์ ที่พัฒนาด้วย ASP.NET บน IIS

    cheerasak.s

    สำหรับนักพัฒนาเว็บแอปพลิเคชัน ที่จะต้องทำหน้าที่ครบวงจร (Full Stack Programer) สิ่งที่ต้องทำหลังจากพัฒนาเว็บขึ้นมาเสร็จแล้ว คือการติดตั้งบนเซิร์ฟเวอร์ (Deploy) ในบทความนี้จะเล่าขั้นตอนหลักๆ ในการติดตั้งเว็บไซต์ ที่พัฒนาด้วย ASP.NET (ไม่ว่าจะพัฒนาด้วย .Net Framework เวอร์ชันไหนก็ขั้นตอนเดียวกัน เปลี่ยนแปลงแค่ .Net Runtime ที่ใช้งาน) บนวินโดวส์เซิร์ฟเวอร์ โดยใช้ IIS (Internet Information Services) ซึ่งหน้าตาอาจเปลี่ยนแปลงไปตามเวอร์ชันของ IIS แต่ขั้นตอนการตั้งค่ายังคงคล้ายคลึงกัน

    Publish เว็บไซต์ (กรณีใช้ Visual Studio)

    1.คลิกขวาที่ชื่อโปรเจ็ค เลือก Publish

    2.จะได้หน้าจอเลือกประเภทในบทความนี้เลือกเป็น Folder เพื่อใช้วิธีการ Deploy แบบนำไฟล์ไปวางที่ Server เอง ดังรูป

    3. เลือกที่ตั้งไฟล์ กด Finish

    4. ตั้งค่าการ Publish จากในรูปคือให้ลบไฟล์ที่มีอยู่ก่อน และใช้รูปแบบ Release ในการ Compile

    5. ตัวอย่างไฟล์ที่ทำการ Publish เสร็จแล้ว

    6. ทำการ Copy ไฟล์ทั้งหมดไปวางใน wwwroot บน Server

    ติดตั้ง Component ต่างๆ

    1.ในบทความนี้ใช้ Windows Server 2016 Datacenter เป็นตัวอย่าง ซึ่งการติดตั้ง Component ต่างๆ สามารถทำได้ผ่าน Server Manager > Manage > Add Roles and Features ได้เกือบทั้งหมด ยกเว้น Runtime อื่นๆที่เว็บไซต์มีการนำมาใช้งานเพิ่มเติม

    2. ติดตั้ง IIS , ASP.NET และ Component ที่เกี่ยวข้อง โดยไปที่ Server Role > Web Server (IIS) และทำการเลือก Component ต่างๆดังรูป จากนั้นกด Next

    3. ติดตั้ง .Net Framework เวอร์ชันที่เว็บไซต์ใช้งาน ในตัวอย่างใช้ .Net Framework 4.6 โดยสามารถเลือกจาก เมนู Features ดังรูป

    4. เท่านี้ก็จะมี Component ที่จำเป็นในการติดตั้งเว็บไซต์ที่พัฒนาด้วย ASP.NET แล้ว

    สร้าง และตั้งค่า Application Pool

    1.เปิดโปรแกรม IIS โดยไปที่ Start > Windows Administrative Tools > Internet information Services (IIS) จะได้หน้าจอดังรูป

    2. เลือกเมนู Application Pool จากนั้นคลิก Add Application Pool จะได้หน้าจอการตั้งค่าดังรูป โดยที่ .Net CLR Version จะแยกเป็น 2.0.xxx และ 4.0.xxx โดยหากต้องการใช้งาน .Net Runtime 3.5 – 4.x สามารถเลือกเป็น 4.0.x ได้ทั้งหมด

    3. เมื่อสร้างสำเร็จ จะมีรายการ Application Pool ที่เราสร้างดังรูป

    สร้าง และตั้งค่าเว็บไซต์ ทดสอบเรียกใช้งาน

    1.ในการสร้างไซต์นั้น หากบน Server นั้นยังไม่มีเว็บไซต์ใดๆ สามารถใช้ Default Web Site ได้เลย แต่ถ้ามีเว็บไซต์อื่นๆอยู่ก่อนแล้ว จะต้องพิจารณาว่าจะให้บริการในแบบใด เป็น Application ที่อยู่ภายใต้เว็บไซต์เดิม หรือแยกออกมาเป็นอีก URL ในส่วนนี้ บทความจะไม่ลงรายละเอียด โดยจะแสดงวิธีการเพิ่ม ไซต์ใหม่ภายใต้ URL เดิมที่มีอยู่แล้วโดยเลือกเมนู Add Website จะได้หน้าจอการตั้งค่าดังรูป

    2. จากนั้นทำการตั้งค่า Default Document โดยคลิกเลือกที่ชื่อเว็บไซต์ เลือกไฟล์ที่ต้องการกำหนดเป็นหน้าแรกของเว็บไซต์

    3. ตั้งค่าต่างๆของเว็บไซต์ ซึ่งขึ้นอยู่กับแต่ละเว็บไซต์ว่ามีการใช้งาน Feature ใดบ้าง ดังรูป (อีกช่องทางนึงคือการแก้ไขไฟล์ web.config โดยตรง)

    4. ทำการทดสอบเรียกใช้งาน โดยคลิกที่เมนู Browse เพื่อเรียกดูแบบ Localhost หรือหากมี URL อยู่แล้วสามารถเรียกดูผ่าน URL/ApplicationName ดังรูป

    ในขั้นตอนติดตั้งชิ้นงานจริง แน่นอนว่าอาจมีขั้นตอนเพิ่มเติมตามแต่ละเว็บไซต์ และอาจพบปัญหาต่างๆ แตกต่างกันไปตามเวอร์ชันของวินโดวส์, IIS, .Net Runtime แต่อย่างไรก็ดีหวังว่าบทความนี้จะเป็นไกด์ไลน์ ให้เห็นภาพขั้นตอนคร่าวๆในการติดตั้งเว็บไซต์หนึ่งๆ สำหรับผู้เริ่มต้นครับ