โซลูชั่นสำหรับการกระจายแอปพลิเคชัน HTML5 เป็นแอปพลิเคชันเดสก์ท็อปหรือไม่ [ปิด]

141

มีโซลูชั่นอะไรบ้างสำหรับการกระจายแอปพลิเคชันเดสก์ท็อปที่ใช้ HTML5

ฉันต้องการแจกจ่ายแอพ HTML5 ของฉันเป็นแอปพลิเคชันเดสก์ทอปแบบสแตนด์อโลนใน Windows, OSX และ Linux ฉันต้องการให้ผู้คนสามารถดับเบิลคลิกที่ไอคอนทางลัดของแอพเพื่อเรียกใช้โปรแกรมของฉัน

ฉันไม่ต้องการให้หน้าต่างเบราว์เซอร์แสดงเพียงแอพของฉัน เป็นไปได้ไหม

javascript  html  desktop-application 
— foreyez
แหล่งที่มา
4
Chrome + แบบเต็มหน้าจอทำงานได้ดี
— PostMan
2
Chrome บน windows มีตัวเลือก "สร้างทางลัดไปยังแอปพลิเคชัน" จากเมนูเครื่องมือ มันจะสร้างลิงค์บนเดสก์ท็อปที่เปิดหน้าต่างมาตรฐานโดยไม่มีแถบที่อยู่
— 6502
3
คุณมีข้อกำหนดอื่น ๆ เช่นการเข้าถึงไฟล์ภายในเครื่องหรือสิ่งอื่น ๆ ที่ปกติแล้วเป็นไปไม่ได้ในเบราว์เซอร์?
— Tiemen
76
ใครสามารถอธิบายได้ว่าทำไมคำถามนี้ถูกทำเครื่องหมายว่าไม่สร้างสรรค์ ? เขาถูกถามว่ามีแพลตฟอร์มคำตอบคือวัตถุประสงค์: ใช่ และอาจ "นำไปใช้" ด้วยความเป็นไปได้บางอย่างดังนั้นทำไมจึงมีการทำเครื่องหมายด้วยวิธีนี้จริงๆ
— Francesco Belladonna
10
คำถามนี้เป็นคำถามทั้งที่เกี่ยวข้องและเฉพาะ - ที่แสดงโดยบทความล่าสุดนี้: clintberry.com/2013/html5-apps-desktop-2013
— ต่อการค้นหา Aronsson

คำตอบ:

75

แอพ HTML5 ในปี 2014

เฟรมโดย chrome / webkit

  • อิเล็กตรอน (อดีตอะตอมเชลล์)

    Electron เป็นห้องสมุดโอเพ่นซอร์สที่พัฒนาโดย GitHub สำหรับการสร้างแอพพลิเคชั่นข้ามแพลตฟอร์มเดสก์ท็อปด้วย HTML, CSS และ JavaScript Electron ทำสิ่งนี้ได้โดยการรวม Chromium และ Node.js ไว้ในรันไทม์เดี่ยวและสามารถบรรจุแอพสำหรับ Mac, Windows และ Linux (ที่มา )

    ผู้ใช้ที่ GitHub ใช้สิ่งนี้เพื่อให้โปรแกรมแก้ไขโค้ด Atomเป็นแอพ มันมีเอกสาร API และช่องทางช่วยเหลือในฟอรัมอย่างเป็นทางการของอะตอม

  • Node-Webkitแนวทางที่น้อยที่สุด

    node-webkit เป็นแอปรันไทม์ของแอปโดยใช้ Chromium และ node.js คุณสามารถเขียนแอปพื้นฐานใน HTML และ JavaScript ด้วย node-webkit นอกจากนี้ยังช่วยให้คุณโทรหาโมดูล Node.js ได้โดยตรงจาก DOM และเปิดใช้งานวิธีใหม่ในการเขียนแอปพลิเคชันดั้งเดิมด้วยเทคโนโลยีเว็บทั้งหมด

    Intel อยู่เบื้องหลังสิ่งนี้ (?) ฉันถูกบอกว่ามันหยาบมากรอบ ๆ ขอบ

  • Brackets Shellกล่องทรายของเครื่องมือแก้ไขรหัส Adobes (และฐานของ Adobe Edge)

    หมายเหตุ: brackets-shell นั้นได้รับการบำรุงรักษาเพื่อใช้งานโดยโครงการ Brackets เท่านั้น แม้ว่าบางคนประสบความสำเร็จในการใช้มันเป็นเปลือกแอพสำหรับโครงการอื่น ๆ เราไม่ได้ให้การสนับสนุนอย่างเป็นทางการสำหรับสิ่งนั้นและเรายังไม่ได้ทำงานมากมายเพื่อให้เชลล์แอปสามารถใช้งานได้ง่าย หลายคนอาจพบว่าการใช้โครงการเช่น node-webkit ง่ายกว่าซึ่งเป็นเรื่องทั่วไปมากขึ้นจากการออกแบบ

    Readme พูดว่า แต่มีคนค่อนข้างมากที่ทำ แต่กระนั้น

Frameworks + Tools

  • Adobe AIRตามคำแนะนำอื่น

    รันไทม์Adobe®AIR®ช่วยให้นักพัฒนาสามารถบรรจุรหัสเดียวกันลงในแอพเนทีฟสำหรับเดสก์ท็อป Windows และ Mac OS เช่นเดียวกับ iPhone, iPad, Kindle Fire, Nook Tablet และอุปกรณ์ Android ™อื่น ๆ เข้าถึงร้านค้ามือถือมากกว่า 500 ล้าน อุปกรณ์

  • Senchaเป็น บริษัท ที่จำหน่ายเครื่องมือสำหรับนักพัฒนาแอพรวมถึงการพัฒนาและแจกจ่ายแอพ html5

วิธีการไม่ใช้งาน

  • Tide SDK ( เก็บถาวรเมื่อวันที่ 2015-07-12 ที่ archive.org ) รุ่นเบต้าหยุดใช้งานเมื่อวันที่ 12 กรกฎาคม 2558

    http://www.tidesdk.org/

  • XULRunner จาก Mozillaอาจทำเคล็ดลับให้คุณ แต่เพิ่มค่าใช้จ่าย

  • app.jsสิ้นสุดวันที่28 ตุลาคม 2013เนื่องจากถูกแซงโดย ( https://github.com/rogerwang/node-webkit )

    เพราะมันง่ายและทรงพลัง การใช้ AppJS คุณไม่ต้องกังวลกับการเขียนโปรแกรมข้ามแพลตฟอร์มหรือเรียนรู้ภาษาและเครื่องมือใหม่ ๆ คุณคุ้นเคยกับ HTML, CSS และ JavaScript แล้ว อะไรจะดีไปกว่าสแต็กนี้สำหรับการพัฒนาแอปพลิเคชัน นอกจาก AppJS ใช้ Chromium เป็นแกนหลักเพื่อให้คุณใช้งาน HTML 5 APIs ล่าสุดได้ ดังนั้นและให้ความสำคัญกับงานที่แอปพลิเคชันของคุณควรทำ

  • Mozilla Prismจะถูกย่อยสลาย slugline ของพวกเขาคือ:

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

— ซามูเอลเฮอร์ชอก
แหล่งที่มา
7
Mozilla Prism ไม่ได้ใช้งานในขณะนี้
— Harshith JV
8
เพียงแค่หัวขึ้นกับ Adobe Air หากคุณวางแผนที่จะใช้โซลูชันเทมเพลต javascript ชนิดใดก็ได้ (เช่นแฮนด์บาร์หนวด) ส่วนใหญ่จะไม่ทำงานเนื่องจากข้อผิดพลาดด้านความปลอดภัยที่เกี่ยวข้องกับฟังก์ชั่นใหม่ () การเรียกใช้จาวาสคริปต์
— James Parker
ขอบคุณสำหรับคำใบ้ที่มีประโยชน์มาก! โชคไม่ดีที่ฉันไม่มีโอกาสทดสอบตัวอย่างใด ๆ ที่กล่าวข้างต้น ฉันแค่รวบรวมพวกมันผ่านการวิจัย
— ซามูเอลเฮอร์ชอก
คุณสามารถทำให้แอปพลิเคชันของคุณทำงานเกินมาตรฐานความปลอดภัย ฉันมีปัญหากับระบบเทมเพลต KendoUI ด้วยและก็สามารถเอาชนะได้ด้วยวิธีใดก็ตามที่ฉันเปลี่ยนจาก Air เป็น Titanium Desktop แต่ขณะนี้ฉันกำลังมองหาทางเลือกเนื่องจากการใช้งาน webkit ของ Windows ของ Windows มีปัญหาร้ายแรงเกี่ยวกับองค์ประกอบของฟอร์ม (อินพุต / ดรอปดาวน์) )
— Vasco Costa
คุณสามารถพิจารณาSentenza Desktopเพื่อแพ็คเกจเว็บแอปพลิเคชัน HTML5 / CSS3 / JS ลงในแอปพลิเคชัน Mac OS X (.app) นอกจากนี้ยังมีห้องสมุด API ไม่ต้องการกรอบใด ๆ (เช่น Adobe Air หรือ TideSDK) รองรับการปรับใช้ Mac App Store
— Beny
15

คุณสามารถใช้ AppJS ซึ่งใช้ Nodejs และ Chromium เพื่อสร้างแอป html5 สำหรับเดสก์ท็อป ตรวจสอบ: http://appjs.com ลิงค์ Github: https://github.com/appjs/appjs

— Morteza Milani
แหล่งที่มา
1
สิ่งที่คล้ายกันคือ node-webkit แต่ก็มีคุณสมบัติที่ดีเช่นการรวบรวมจาวาสคริปต์ของคุณโดยใช้ v8 snapshot ลิงก์
— pillar15
ประกาศเลิกใช้งานโครงการ AppJS ยังไม่ได้รับการพัฒนาอย่างแข็งขันเป็นเวลาสองสามปี โปรดตรวจสอบ NW.js หรืออิเล็กตรอนแทน
— Aaron Franke
10

คุณอาจต้องการดู XULRunner จาก Mozilla ที่ระดับ 10,000 ฟุตเบราว์เซอร์ FireFox เป็นแอปพลิเคชั่น XULRunner (เห็นได้ชัดว่าซับซ้อนมาก แต่ ... ) แต่ XULRunner ช่วยให้คุณใช้ Javascript และ XML เพื่อสร้างแอปพลิเคชันและหน้าต่างเบราว์เซอร์เป็นหนึ่งในองค์ประกอบเหล่านั้นดังนั้นเมื่อคุณเปิดหน้าต่างพื้นฐานขึ้นคุณจะสามารถทำสิ่งใดก็ได้ที่คุณต้องการ

นอกจากนี้ยังขึ้นอยู่กับความซับซ้อนของแอปพลิเคชันของคุณมีเฟรมเวิร์ก "วิดเจ็ต" หลายอย่าง (เช่น Dashboard บน Mac, Yahoo Widgets, Windows Gadgets) ซึ่งโดยทั่วไปแล้ว HTML runtimes ก็เช่นกัน

— Will Hartung
แหล่งที่มา
2
ฉันขอแนะนำให้ดูที่ XULRunner สำหรับสิ่งที่คุณอธิบายมันเหมาะและบันทึกไว้อย่างดี Chrome ก็ใช้งานได้เช่นกันฉันคิดว่า แต่ฉันไม่ได้ดู
— Jared Farrish
XUL runner เป็นเฟรมเวิร์กที่ยอดเยี่ยมและมีความยืดหยุ่นสูง แต่ไม่ได้รับการบันทึกไว้อย่างดีตามที่คุณพูด มือใหม่จะต้องทนทุกข์ทรมานมากเพื่อให้ได้สิ่งที่เริ่มต้น
— esafwan
10

ตรวจสอบไทเทเนียมอย่างแน่นอน แค่วันนี้ฉันใช้แอพ HTML5 ที่ใช้งานได้และด้วยการดัดแปลงเล็กน้อยก็สามารถวางลงใน Titanium และนำไปใช้กับ Mac, Windows และ Linux

และยังรองรับ PHP, Python และ Ruby หากแอปของคุณต้องการการประมวลผลแบบ "ฝั่งเซิร์ฟเวอร์"

— ggutenberg
แหล่งที่มา
หากคุณต้องการวิธีการแก้ไขปัญหาแบบล่วงหน้าฉันคิดว่านี่เป็นคำตอบ
— dylanized
15
ประสบการณ์ของฉันกับไทเทเนียมแย่มาก - มันดูดีจากภายนอก แต่เต็มไปด้วยข้อบกพร่องและกลายเป็นนรกที่จะใช้อย่างรวดเร็ว ฉันไม่สามารถแนะนำได้
— เดเมียน
3
ฉันยังคิดว่านี่จะเป็นตัวเลือกที่ดี แต่: 1) ฉันไม่สามารถทำให้มันง่าย "สร้างโครงการใหม่ / เรียกใช้" ใน Linux (Ubuntu 11.10) 2) Titanium Desktop กำลังถูกแปลงเป็นโครงการ COmmunity-Driven ( นั่นหมายความว่าถ้าไม่มีใครใช้รหัสของพวกเขามันจะตาย)
— ลูอิสโลโบโบโรเบีย
4
ฉันรู้ว่ามันเก่า แต่ฉันเพิ่งอ่านคำตอบนี้และใช้เวลาสักพักจนกระทั่งฉันคิดว่า Titanium Desktop ตายแล้ว ดังนั้นไม่ใช่ตัวเลือกอีกต่อไป BTW ฉันกำลังคิดเกี่ยวกับการสร้างบางสิ่งบางอย่างด้วย c # และโครเมียมฝังตัวตามที่ Github ทำในเครื่องมือสำหรับ windows
— NicoGranelli
6
Titanium Desktop กลายเป็น TideSDK tidesdk.org
— Peacemoon
5

Chrome สามารถทำสิ่งที่ปริซึมดูได้ - เครื่องมือ -> สร้างทางลัดไปยังแอปพลิเคชัน

— user822746
แหล่งที่มา
ไม่ทราบว่า ... +1
— arg20
น่าเสียดายที่แอพพลิเคชั่นทางลัดไม่สามารถใช้ได้กับ Mac
— Shane Holloway
4

คุณสามารถลองใช้ Phonegap ได้โดยมีพอร์ตของ Windows Desktop: https://github.com/davejohnson/phonegap-windows

ฉันลอง mac-port มันใช้งานได้ดี ฉันยังไม่ได้ลองรุ่น windows

— Christian Kuetbach
แหล่งที่มา
1
การเชื่อมโยงสำหรับ Mac รุ่น-พอร์ตgithub.com/shazron/phonegap-mac ไชโย
— TonyTakeshi
3

Adobe AIRมีวัตถุประสงค์เพื่อให้คุณทำงานเป็นหลักใน HTML, CSS และ JavaScript ในขณะที่ให้แอปพลิเคชันเดสก์ท็อป (Caveat: ฉันไม่ได้ใช้มันด้วยตัวเอง)

— TJ Crowder
แหล่งที่มา
1
เบราว์เซอร์ที่รวมอยู่ใน AIR นั้นเก่าและจะไม่อัปเดตดังนั้นฉันจึงไม่แนะนำ (ฉันใช้ในโครงการอื่น ๆ อีกมากมาย)
— simion314
@ simion314: ฉันอยากรู้อยากเห็นเนื่องจาก AIR เป็นโครงการที่กำลังดำเนินอยู่ทำไมคุณพูดว่าเบราว์เซอร์ในนั้นจะ "ไม่" ได้รับการอัปเดต
— TJ Crowder
ดูforum.adobe.com/message/6177332 Adobe ทำงานได้มากขึ้นสำหรับส่วนมือถือของ AIR และบนมือถือพวกเขาใช้ StageWebView และพวกเขาจะไม่อัปเดตเครื่องมือ webkit ใน AIR stagewebview จำกัด เฉพาะการแสดงเนื้อหาเช่นถ้าคุณ พยายามโหลดไลบรารีจาวาสคริปต์ที่ซับซ้อนหรือแอปพลิเคชันเช่น ckeditor 4 มันจะล้มเหลวเนื่องจากความเข้ากันไม่ได้กับเอ็นจิ้น webkit (บางอันเกี่ยวข้องกับ
— sandbox
3

[บน Windows เท่านั้น] ลองใช้ HTML Application (HTA) เพียงบันทึกไฟล์. html ของคุณด้วยนามสกุล. hta นอกจากนี้ยังมีการตั้งค่าเพิ่มเติมบางอย่างเพื่อกำจัดหน้าต่างเบราว์เซอร์ตั้งระดับความไว้วางใจสำหรับแอพ ฯลฯ อ่านเพิ่มเติมได้ที่นี่: http://en.wikipedia.org/wiki/HTML_Applicationและที่นี่http://technet.microsoft co.th / en-cA / scriptcenter / dd742317.aspx

— วิก
แหล่งที่มา
2

อืม ... เครื่องเสมือนสำหรับ HTML5 / CSS / JS ... ดูเหมือนเบราว์เซอร์ :)

บางที Adobe AIR อาจใช้กลอุบายเพราะมันขึ้นอยู่กับแนวคิดการนำแอพอินเทอร์เน็ตที่มีอยู่มาไว้ในเดสก์ท็อป อย่างไรก็ตามฉันไม่เคยใช้มันเลย

สิ่งหนึ่งที่คุณสามารถทำได้คือการพัฒนาแอพเดสก์ท็อปขั้นพื้นฐานที่ใช้การควบคุมเว็บเบราว์เซอร์ prepackaged (เช่นหากคุณกำลังพัฒนาสำหรับ Mac เพียงแค่วาง WebView ลงในหน้าต่างและเพิ่มรหัสพื้นฐานเพื่อโหลด html ของคุณบนแอป เริ่มต้น)

— เจฟฟ์
แหล่งที่มา
2

ตรวจสอบโครงการใหม่นี้จาก Mozilla คุณสามารถสร้างแอพเดสก์ท็อปได้เช่นกัน: https://developer.mozilla.org/en/Apps

รายละเอียดที่นี่: http://hacks.mozilla.org/2012/05/desktop-apps-with-html5-and-the-mozilla-web-runtime/

— Peacemoon
แหล่งที่มา
1
น่าเสียดายที่พวกเขาไม่ได้สร้างมันเป็นแอปที่ไม่มีสีเลย
— Frank
1

สำหรับโทรศัพท์มือถือที่คุณสามารถใช้ PhoneGap http://www.phonegap.com/ อาจเป็นไปได้ด้วยการเข้ารหัสเพิ่มเติมบางอย่างที่คุณสามารถใช้สำหรับเดสก์ท็อป

— user977828
แหล่งที่มา
1

ปัจจุบันคำตอบคือโซลูชั่นที่แตกต่างกันของแต่ละแพลตฟอร์ม

  • สำหรับ MAC OSX คุณจะสร้าง Cocoa Desktop App ด้วย UIWebView
  • สำหรับ Windows คุณจะสร้างแอป. NET บนเดสก์ท็อปด้วยองค์ประกอบของเบราว์เซอร์
— มุสตาฟาฮันนิฟ
แหล่งที่มา
ฉันคิดว่ากว่าใช้ windows ที่มีองค์ประกอบของเบราว์เซอร์มีข้อ จำกัด หลายประการ (สามารถเข้าถึงระบบไฟล์หรือแสดงป๊อปอัปได้หรือไม่) คุณรู้จักโครงการใดบ้างที่ใช้วิธีนี้หรือไม่ ...
— clagccs
คำตอบที่ดีที่สุดและไม่มีใครยอมรับมัน ที่ด้านหลังส่วนใหญ่โซลูชันไฮบริดทั้งหมดใช้ส่วนประกอบมุมมองเว็บที่ทำงานเหมือนกับเบราว์เซอร์ นี่คือทั้งหมดที่คุณต้องการรับ webview up โหลด html / css / js และ voila!
— Dan Ochiana
1

คุณสามารถใช้เซิร์ฟเวอร์ฝังตัวเช่น Tomcat หรือ Apache

ฉันใช้ Tomcat สำหรับเว็บแอปพลิเคชัน Java ที่สมบูรณ์ เรียกใช้ภายในเบราว์เซอร์ แต่ต้องติดตั้งแอปพลิเคชัน ทางลัดเพื่อเริ่มแอปเริ่มบริการและเปิดเบราว์เซอร์

หรือลองใช้ webkit

— บรูโน่ Tafarelo
แหล่งที่มา
1

ช้าไปหน่อย แต่คุณสามารถใช้ google chrome รุ่นพกพาได้จากนั้นสร้างแอพ windows เล็ก ๆ เพื่อติดตั้งและสร้างทางลัด .ink ไปที่ --kiosk และแอพโหมด
ค่อนข้างชอบแอปพลิเคชันทางลัดของ Chrome แต่คุณติดตั้ง Chrome ไว้ที่ไหน

— ตรงไปตรงมา
แหล่งที่มา
1

หากคุณต้องการใช้กับ Windows คุณควรพิจารณา HTML Applications (HTA) ซึ่งเป็นส่วนหนึ่งของ Internet Explorer ตั้งแต่ IE 5 (10+ ปี)

ไม่จำเป็นต้องใช้เซิร์ฟเวอร์, การจัดรูปแบบ HTML เต็มรูปแบบ, การเข้าถึงทรัพยากรในท้องถิ่น (แม้กระทั่งพอร์ต COM / USB) อย่างยอดเยี่ยม นอกจากนี้ง่ายต่อการดีบักด้วย Visual Studio เพียงผูกกับ MSHTA.exe

คุณสามารถเปิดใช้งาน HTML 5 ใน HTA ด้วยเมตาแท็กต่อไปนี้:

<!-- enable html5 features --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
— วิลเลียมวอลเซท
แหล่งที่มา
+1 มองหาการรองรับ Linux และ Mac ด้วย :)
— Bhargav Nanekalva
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.