ตอนจบของสามก๊กสอนว่า ความดีเท่านั้นที่จะยังคงอยู่ตลอดไป
|
||||
การสร้าง extension ของ Chrome ด้วย Flutter Web App หลังพัฒนาเวบแอพ โดยใช้ Flutter แล้ว สามารถทำเป็น extension ของ Chrome ได้ดังนี้ * Flutter สามารถพัฒนาแอพ บน android, iphone และ web app ได้ 1. ไฟล์ manifest.json เดิม ให้ลบออก และใช้ตามนี้ manifest.json ========== { "name": "Calendar Ext", "version": "1.0", "description": "This is a flutter chrome extension", "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", "browser_action": { "default_popup": "index.html", "default_icon": "/icons/Icon-192.png" }, "manifest_version": 2 } 2. index.html ในส่วน ที่มีการเรียกใช้ js script ให้แยกไป file ใหม่ เช่น fapp.html index.html ======= <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="description" content="A new Flutter project."> <!-- iOS meta tags & icons --> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-title" content="ปฎิทินไทย"> <link rel="apple-touch-icon" href="icons/Icon-192.png"> <!-- Favicon --> <link rel="shortcut icon" type="image/png" href="favicon.png"/> <title>ปฎิทินไทย</title> <link rel="manifest" href="manifest.json"> </head> <body> <!-- This script installs service_worker.js to provide PWA functionality to application. For more information, see: https://developers.google.com/web/fundamentals/primers/service-workers --> <iframe height="540" width="360" src="fapp.html" frameborder="0"></iframe> </body> </html> 3. แยกส่วน ที่เรียกใช้ js script มาไว้ที่ไฟล์นี้ fapp.html ======== <!DOCTYPE html> <html> <body> <!-- This script installs service_worker.js to provide PWA functionality to application. For more information, see: https://developers.google.com/web/fundamentals/primers/service-workers --> <!-- script> if ('serviceWorker' in navigator) { window.addEventListener('load', function () { navigator.serviceWorker.register('flutter_service_worker.js?v=2163580266'); }); } </script --> <script src="main.dart.js" type="application/javascript"></script> </body> </html> หลังจาก build เป็นเวบแล้ว ให้ ไปที่ chrome => extension แล้วเลือก เมนู load unpack จะปรากฎ เมนูในส่วน extension ขึ้นมา |
thaiger_u
Rss Feed Smember ผู้ติดตามบล็อก : 3 คน [?] @ฟรี โปรแกรมปฏิทิน 2564 - Free android app @ รับสอน เขียนโปรแกรม Python ระดับมัธยมปลาย Group Blog All Blog
|
|||
Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved. |