Ionic 7+Angular:PWA camera 相機功能比較

更新於 發佈於 閱讀時間約 3 分鐘

PWA(Progressive Web App) 是一種可以在手機上偽裝成 APP 的網頁瀏覽技術,它不用上架到 store,很適合行銷工具使用,像是 Youtube(影音社交媒體)、Spotify(音樂串流平台)、Visit Japan Web(入境日本填寫資料)、一些個人品牌電商網站,都利用這個技術。

那麼如果作為開發者呢?我們會看到 PWA 對手機原生功能支援有限的文章,但不知道實際表現到底如何。以下文章是使用 Ionic Angular PWA 在各載體中,對於相機功能的比較紀錄:


▍ PWA 相機 & 手機相機,功能比較

raw-image

坦白說我剛開始研究 PWA 的時候還是對它信心滿滿的,因為我是 web 開發人員,要直接跳入 APP 開發技術真的需要適應,所以如果能用 web 做到類似功能是最理想不過的事情。但測試結果與手機原生照相功能比較,有著實在讓人無法忽視的缺陷:

  1. 直立拿著 iPad,卻是橫式相機介面,拍攝出的照片又是直式。
  2. 無法用手勢拉遠近或調整亮度。

剩下其他缺陷,我直接列在圖片上面。但以使用者習慣而言,上述任一項都會造成不順利感受。

所以看來還是回到專案需求,看需要用到多少手機原生功能,或是在 APP 與 PWA 同時並存下,在 PWA 隱藏部分功能。

附上範例 PWA 網站:https://photo-gallery-20241230.web.app/tabs/tab2

安裝方式可以搜尋關鍵字:PWA、你的手機系統、你的瀏覽器


▍ 延伸閱讀



Ann Chou 喜愛電影和威士忌,既是前端工程師,也是藝術愛好者。喜歡書寫學習歷程和技術文件,掌握經驗與隨時提取的感覺很好。
留言
avatar-img
留言分享你的想法!
Rewrite-avatar-img
2025/01/19
很清楚的評比,感覺上PWA 是一個在使用者沒有安裝APP的情境下的過渡方式,網頁行為要支援手機原生功能,就算可以使用,體感上還是有差
Ann Chou-avatar-img
發文者
2025/01/19
Rewrite 謝謝留言!尤其相機是手機使用者都很熟悉的功能,有一點操作不順都會造成強烈負評反饋。不過如果以純資訊瀏覽來說,我還是很喜歡 PWA 不用安裝 APP 的便利性的。
avatar-img
Ann Chou的沙龍
16會員
28內容數
從藝術領域轉職到前端工程師,喜歡書寫學習歷程和技術文件,掌握經驗與隨時提取的感覺很好。
Ann Chou的沙龍的其他內容
2025/04/27
這篇文章說明如何在 Windows 電腦上設定 Android 推播通知,包含使用 Expo 串接 Firebase 和 Azure 的步驟。文章涵蓋 Firebase 和 Azure 的設定,以及 Android Studio 和 JDK 的配置。
2025/04/27
這篇文章說明如何在 Windows 電腦上設定 Android 推播通知,包含使用 Expo 串接 Firebase 和 Azure 的步驟。文章涵蓋 Firebase 和 Azure 的設定,以及 Android Studio 和 JDK 的配置。
2025/04/20
介紹在 React Native / Expo 中實作推播通知的方式,並比較使用 Expo Notifications 與整合 Firebase Cloud Messaging(FCM)或 Azure Notification Hubs 的差異。
2025/04/20
介紹在 React Native / Expo 中實作推播通知的方式,並比較使用 Expo Notifications 與整合 Firebase Cloud Messaging(FCM)或 Azure Notification Hubs 的差異。
2025/04/19
本篇主題是 React Native 小介紹。 因為先前在測試 Ionic + PWA 開發,對相機功能實在太失望,結果現在我開始用 React Native / Expo 了。 如果還不清楚 Ionic 和 Reac Native 能做不同種類的 App,可以先閱讀 App 種類概述 。
2025/04/19
本篇主題是 React Native 小介紹。 因為先前在測試 Ionic + PWA 開發,對相機功能實在太失望,結果現在我開始用 React Native / Expo 了。 如果還不清楚 Ionic 和 Reac Native 能做不同種類的 App,可以先閱讀 App 種類概述 。
看更多
你可能也想看
Thumbnail
大家好,我是一名眼科醫師,也是一位孩子的媽 身為眼科醫師的我,我知道視力發展對孩子來說有多關鍵。 每到開學季時,診間便充斥著許多憂心忡忡的家屬。近年來看診中,兒童提早近視、眼睛疲勞的案例明顯增加,除了3C使用過度,最常被忽略的,就是照明品質。 然而作為一位媽媽,孩子能在安全、舒適的環境
Thumbnail
大家好,我是一名眼科醫師,也是一位孩子的媽 身為眼科醫師的我,我知道視力發展對孩子來說有多關鍵。 每到開學季時,診間便充斥著許多憂心忡忡的家屬。近年來看診中,兒童提早近視、眼睛疲勞的案例明顯增加,除了3C使用過度,最常被忽略的,就是照明品質。 然而作為一位媽媽,孩子能在安全、舒適的環境
Thumbnail
我的「媽」呀! 母親節即將到來,vocus 邀請你寫下屬於你的「媽」故事——不管是紀錄爆笑的日常,或是一直想對她表達的感謝,又或者,是你這輩子最想聽她說出的一句話。 也歡迎你曬出合照,分享照片背後的點點滴滴 ♥️ 透過創作,將這份情感表達出來吧!🥹
Thumbnail
我的「媽」呀! 母親節即將到來,vocus 邀請你寫下屬於你的「媽」故事——不管是紀錄爆笑的日常,或是一直想對她表達的感謝,又或者,是你這輩子最想聽她說出的一句話。 也歡迎你曬出合照,分享照片背後的點點滴滴 ♥️ 透過創作,將這份情感表達出來吧!🥹
Thumbnail
PWA(Progressive Web App) 是一種可以在手機上偽裝成 APP 的網頁瀏覽技術,它不用上架到 store,很適合行銷工具使用。那麼如果作為開發者呢?以下文章是使用 Ionic Angular PWA 在各載體中,對於相機功能的比較紀錄。
Thumbnail
PWA(Progressive Web App) 是一種可以在手機上偽裝成 APP 的網頁瀏覽技術,它不用上架到 store,很適合行銷工具使用。那麼如果作為開發者呢?以下文章是使用 Ionic Angular PWA 在各載體中,對於相機功能的比較紀錄。
Thumbnail
2009-2011年智慧型手機還不普遍的時候,我當時在澳洲,每天扛著我的單眼到處拍照。 2011年回到台灣,當時的台灣智慧型手機開始普遍,有了手機之後單眼就漸漸被我遺忘,變成了古董裝飾品,拍照也成為我們的日常。 人都是貪心的🤣,我常常覺得手機方便似乎有些拍照功能也受限,例如:我先生是足球教練,
Thumbnail
2009-2011年智慧型手機還不普遍的時候,我當時在澳洲,每天扛著我的單眼到處拍照。 2011年回到台灣,當時的台灣智慧型手機開始普遍,有了手機之後單眼就漸漸被我遺忘,變成了古董裝飾品,拍照也成為我們的日常。 人都是貪心的🤣,我常常覺得手機方便似乎有些拍照功能也受限,例如:我先生是足球教練,
Thumbnail
智慧型手機已是日常生活中不可或缺的恩物,可以倚賴的功能實在非常之多。就我個人而言,通訊聯絡之外,最大宗的用途還是「影像紀錄」。不知你喜不喜歡「自拍」? 我雖非狂熱的使用者,但自拍的次數已是與日俱增。
Thumbnail
智慧型手機已是日常生活中不可或缺的恩物,可以倚賴的功能實在非常之多。就我個人而言,通訊聯絡之外,最大宗的用途還是「影像紀錄」。不知你喜不喜歡「自拍」? 我雖非狂熱的使用者,但自拍的次數已是與日俱增。
Thumbnail
身處於手機效能達到巔峰的時代,我們不禁思考「到底該如何脫穎而出呢?」近年來,安卓陣營的手機製造商不約而同地將差異化焦點放在了「相機」上!像是小米與萊卡、OPPO與哈蘇、VIVO與蔡司,這些手機與知名相機品牌的合作,讓中國安卓旗艦手機的拍攝能力在短短幾年內突飛猛進,每個品牌都為自己的影像旗艦機走出了一
Thumbnail
身處於手機效能達到巔峰的時代,我們不禁思考「到底該如何脫穎而出呢?」近年來,安卓陣營的手機製造商不約而同地將差異化焦點放在了「相機」上!像是小米與萊卡、OPPO與哈蘇、VIVO與蔡司,這些手機與知名相機品牌的合作,讓中國安卓旗艦手機的拍攝能力在短短幾年內突飛猛進,每個品牌都為自己的影像旗艦機走出了一
Thumbnail
因為使用安卓手機,一直以來我都是使用Keep記事本寫稿。 因為會自動儲存上雲端,所以就算用其他裝置,只要有登入帳號,都可以在幾分鐘內在其他裝置同步更新,換裝置也能無縫銜接,非常迅速方便。 其他手機像是iOS應該也有類似App可以利用。 然後剛好看到這篇,我沒有女朋友也沒辦法給建議🥹
Thumbnail
因為使用安卓手機,一直以來我都是使用Keep記事本寫稿。 因為會自動儲存上雲端,所以就算用其他裝置,只要有登入帳號,都可以在幾分鐘內在其他裝置同步更新,換裝置也能無縫銜接,非常迅速方便。 其他手機像是iOS應該也有類似App可以利用。 然後剛好看到這篇,我沒有女朋友也沒辦法給建議🥹
Thumbnail
由於iphone的「捷徑」功能實在太方便,連續幾篇都在探索還有什麼應用,這篇加上「動作按鈕」使用,讓捷徑功能更強大! 首先,預設的動作按鈕開啟相機功能需要進入UI畫面,然後再進行拍照,但有時畫面一閃而過,根本來不及捕捉。因此,今天分享一個簡化拍照動作的方法,只需一鍵完成拍照。 步驟如下: 先建
Thumbnail
由於iphone的「捷徑」功能實在太方便,連續幾篇都在探索還有什麼應用,這篇加上「動作按鈕」使用,讓捷徑功能更強大! 首先,預設的動作按鈕開啟相機功能需要進入UI畫面,然後再進行拍照,但有時畫面一閃而過,根本來不及捕捉。因此,今天分享一個簡化拍照動作的方法,只需一鍵完成拍照。 步驟如下: 先建
Thumbnail
使用相機作為日常紀錄的你,有想過為什麼不使用較為輕便的手機,作為拍攝器材嗎?思考完,或許就可以釋懷的放下相機,也放下頸椎發炎的風險,甚至可以省下不少的金錢,投向手機攝影的懷抱。
Thumbnail
使用相機作為日常紀錄的你,有想過為什麼不使用較為輕便的手機,作為拍攝器材嗎?思考完,或許就可以釋懷的放下相機,也放下頸椎發炎的風險,甚至可以省下不少的金錢,投向手機攝影的懷抱。
Thumbnail
還記得在我小學的時候,筆記型電腦不那麼普遍,如果想要看小說或是漫畫,人就一定要跟桌上型電腦綁定,沒辦法像一般書本一樣在任何地點隨心所欲地閱讀小說。 後來到了我國中的時候,mp4 開始變得非常的盛行,除了聽音樂之外,還可以將 .txt 檔案匯入mp4,讓我可以在看網路小說時不再受限於電腦⋯⋯
Thumbnail
還記得在我小學的時候,筆記型電腦不那麼普遍,如果想要看小說或是漫畫,人就一定要跟桌上型電腦綁定,沒辦法像一般書本一樣在任何地點隨心所欲地閱讀小說。 後來到了我國中的時候,mp4 開始變得非常的盛行,除了聽音樂之外,還可以將 .txt 檔案匯入mp4,讓我可以在看網路小說時不再受限於電腦⋯⋯
Thumbnail
近年因為疫情的關係,蘋果公司將年度全球開發者大會WWDC( Apple Worldwide Developers Conference)改為全線上舉行,並在台灣時間6月23日(2021年),由蘋果工程主管輪番上陣講解iOS、iPadOS、macOS、tvOS與watchOS等系統軟體的最新發展。
Thumbnail
近年因為疫情的關係,蘋果公司將年度全球開發者大會WWDC( Apple Worldwide Developers Conference)改為全線上舉行,並在台灣時間6月23日(2021年),由蘋果工程主管輪番上陣講解iOS、iPadOS、macOS、tvOS與watchOS等系統軟體的最新發展。
Thumbnail
雖然說手機的功能日趨強大,或許在許多人心中,手機功能也已經足夠,但有時候遇到稍微嚴苛的場景之下,總不免有那種,欸!還是拍不到的遺憾,而帶著單眼,在旅程中佔空間,又嫌太重,有時候少了長焦段又必須更換望遠鏡頭,又要多帶一顆,如果不想花大錢又不想拍照到處被環境限制,有了一台隨身機,可讓完全部用擔心上述問題
Thumbnail
雖然說手機的功能日趨強大,或許在許多人心中,手機功能也已經足夠,但有時候遇到稍微嚴苛的場景之下,總不免有那種,欸!還是拍不到的遺憾,而帶著單眼,在旅程中佔空間,又嫌太重,有時候少了長焦段又必須更換望遠鏡頭,又要多帶一顆,如果不想花大錢又不想拍照到處被環境限制,有了一台隨身機,可讓完全部用擔心上述問題
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News