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

更新 發佈閱讀 3 分鐘

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

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


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

vocus|新世代的創作平台

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

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

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

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

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

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


▍ 延伸閱讀



Ann Chou 喜愛電影和威士忌,既是前端工程師,也是藝術愛好者。喜歡書寫學習歷程和技術文件,掌握經驗與隨時提取的感覺很好。
留言
avatar-img
Ann Chou的沙龍
19會員
32內容數
從藝術領域轉職到前端工程師,喜歡書寫學習歷程和技術文件,掌握經驗與隨時提取的感覺很好。
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
由於iphone的「捷徑」功能實在太方便,連續幾篇都在探索還有什麼應用,這篇加上「動作按鈕」使用,讓捷徑功能更強大! 首先,預設的動作按鈕開啟相機功能需要進入UI畫面,然後再進行拍照,但有時畫面一閃而過,根本來不及捕捉。因此,今天分享一個簡化拍照動作的方法,只需一鍵完成拍照。 步驟如下: 先建
Thumbnail
由於iphone的「捷徑」功能實在太方便,連續幾篇都在探索還有什麼應用,這篇加上「動作按鈕」使用,讓捷徑功能更強大! 首先,預設的動作按鈕開啟相機功能需要進入UI畫面,然後再進行拍照,但有時畫面一閃而過,根本來不及捕捉。因此,今天分享一個簡化拍照動作的方法,只需一鍵完成拍照。 步驟如下: 先建
Thumbnail
還記得在我小學的時候,筆記型電腦不那麼普遍,如果想要看小說或是漫畫,人就一定要跟桌上型電腦綁定,沒辦法像一般書本一樣在任何地點隨心所欲地閱讀小說。 後來到了我國中的時候,mp4 開始變得非常的盛行,除了聽音樂之外,還可以將 .txt 檔案匯入mp4,讓我可以在看網路小說時不再受限於電腦⋯⋯
Thumbnail
還記得在我小學的時候,筆記型電腦不那麼普遍,如果想要看小說或是漫畫,人就一定要跟桌上型電腦綁定,沒辦法像一般書本一樣在任何地點隨心所欲地閱讀小說。 後來到了我國中的時候,mp4 開始變得非常的盛行,除了聽音樂之外,還可以將 .txt 檔案匯入mp4,讓我可以在看網路小說時不再受限於電腦⋯⋯
Thumbnail
使用相機作為日常紀錄的你,有想過為什麼不使用較為輕便的手機,作為拍攝器材嗎?思考完,或許就可以釋懷的放下相機,也放下頸椎發炎的風險,甚至可以省下不少的金錢,投向手機攝影的懷抱。
Thumbnail
使用相機作為日常紀錄的你,有想過為什麼不使用較為輕便的手機,作為拍攝器材嗎?思考完,或許就可以釋懷的放下相機,也放下頸椎發炎的風險,甚至可以省下不少的金錢,投向手機攝影的懷抱。
Thumbnail
身處於手機效能達到巔峰的時代,我們不禁思考「到底該如何脫穎而出呢?」近年來,安卓陣營的手機製造商不約而同地將差異化焦點放在了「相機」上!像是小米與萊卡、OPPO與哈蘇、VIVO與蔡司,這些手機與知名相機品牌的合作,讓中國安卓旗艦手機的拍攝能力在短短幾年內突飛猛進,每個品牌都為自己的影像旗艦機走出了一
Thumbnail
身處於手機效能達到巔峰的時代,我們不禁思考「到底該如何脫穎而出呢?」近年來,安卓陣營的手機製造商不約而同地將差異化焦點放在了「相機」上!像是小米與萊卡、OPPO與哈蘇、VIVO與蔡司,這些手機與知名相機品牌的合作,讓中國安卓旗艦手機的拍攝能力在短短幾年內突飛猛進,每個品牌都為自己的影像旗艦機走出了一
Thumbnail
2009-2011年智慧型手機還不普遍的時候,我當時在澳洲,每天扛著我的單眼到處拍照。 2011年回到台灣,當時的台灣智慧型手機開始普遍,有了手機之後單眼就漸漸被我遺忘,變成了古董裝飾品,拍照也成為我們的日常。 人都是貪心的🤣,我常常覺得手機方便似乎有些拍照功能也受限,例如:我先生是足球教練,
Thumbnail
2009-2011年智慧型手機還不普遍的時候,我當時在澳洲,每天扛著我的單眼到處拍照。 2011年回到台灣,當時的台灣智慧型手機開始普遍,有了手機之後單眼就漸漸被我遺忘,變成了古董裝飾品,拍照也成為我們的日常。 人都是貪心的🤣,我常常覺得手機方便似乎有些拍照功能也受限,例如:我先生是足球教練,
Thumbnail
背景:從冷門配角到市場主線,算力與電力被重新定價   小P從2008進入股市,每一個時期的投資亮點都不同,記得2009蘋果手機剛上市,當時蘋果只要在媒體上提到哪一間供應鏈,隔天股價就有驚人的表現,當時光學鏡頭非常熱門,因為手機第一次搭上鏡頭可以拍照,也造就傳統相機廠的殞落,如今手機已經全面普及,題
Thumbnail
背景:從冷門配角到市場主線,算力與電力被重新定價   小P從2008進入股市,每一個時期的投資亮點都不同,記得2009蘋果手機剛上市,當時蘋果只要在媒體上提到哪一間供應鏈,隔天股價就有驚人的表現,當時光學鏡頭非常熱門,因為手機第一次搭上鏡頭可以拍照,也造就傳統相機廠的殞落,如今手機已經全面普及,題
Thumbnail
PWA(Progressive Web App) 是一種可以在手機上偽裝成 APP 的網頁瀏覽技術,它不用上架到 store,很適合行銷工具使用。那麼如果作為開發者呢?以下文章是使用 Ionic Angular PWA 在各載體中,對於相機功能的比較紀錄。
Thumbnail
PWA(Progressive Web App) 是一種可以在手機上偽裝成 APP 的網頁瀏覽技術,它不用上架到 store,很適合行銷工具使用。那麼如果作為開發者呢?以下文章是使用 Ionic Angular PWA 在各載體中,對於相機功能的比較紀錄。
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
本文分析導演巴里・柯斯基(Barrie Kosky)如何運用極簡的舞臺配置,將布萊希特(Bertolt Brecht)的「疏離效果」轉化為視覺奇觀與黑色幽默,探討《三便士歌劇》在當代劇場中的新詮釋,並藉由舞臺、燈光、服裝、音樂等多方面,分析該作如何在保留批判核心的同時,觸及觀眾的觀看位置與人性幽微。
Thumbnail
本文分析導演巴里・柯斯基(Barrie Kosky)如何運用極簡的舞臺配置,將布萊希特(Bertolt Brecht)的「疏離效果」轉化為視覺奇觀與黑色幽默,探討《三便士歌劇》在當代劇場中的新詮釋,並藉由舞臺、燈光、服裝、音樂等多方面,分析該作如何在保留批判核心的同時,觸及觀眾的觀看位置與人性幽微。
Thumbnail
5 月將於臺北表演藝術中心映演的「2026 北藝嚴選」《海妲・蓋柏樂》,由臺灣劇團「晃晃跨幅町」製作,本文將以從舞台符號、聲音與表演調度切入,討論海妲・蓋柏樂在父權社會結構下的困境,並結合榮格心理學與馮.法蘭茲對「阿尼姆斯」與「永恆少年」原型的分析,理解女人何以走向精神性的操控、毀滅與死亡。
Thumbnail
5 月將於臺北表演藝術中心映演的「2026 北藝嚴選」《海妲・蓋柏樂》,由臺灣劇團「晃晃跨幅町」製作,本文將以從舞台符號、聲音與表演調度切入,討論海妲・蓋柏樂在父權社會結構下的困境,並結合榮格心理學與馮.法蘭茲對「阿尼姆斯」與「永恆少年」原型的分析,理解女人何以走向精神性的操控、毀滅與死亡。
Thumbnail
智慧型手機已是日常生活中不可或缺的恩物,可以倚賴的功能實在非常之多。就我個人而言,通訊聯絡之外,最大宗的用途還是「影像紀錄」。不知你喜不喜歡「自拍」? 我雖非狂熱的使用者,但自拍的次數已是與日俱增。
Thumbnail
智慧型手機已是日常生活中不可或缺的恩物,可以倚賴的功能實在非常之多。就我個人而言,通訊聯絡之外,最大宗的用途還是「影像紀錄」。不知你喜不喜歡「自拍」? 我雖非狂熱的使用者,但自拍的次數已是與日俱增。
Thumbnail
這是一場修復文化與重建精神的儀式,觀眾不需要完全看懂《遊林驚夢:巧遇Hagay》,但你能感受心與土地團聚的渴望,也不急著在此處釐清或定義什麼,但你的在場感受,就是一條線索,關於如何找著自己的路徑、自己的聲音。
Thumbnail
這是一場修復文化與重建精神的儀式,觀眾不需要完全看懂《遊林驚夢:巧遇Hagay》,但你能感受心與土地團聚的渴望,也不急著在此處釐清或定義什麼,但你的在場感受,就是一條線索,關於如何找著自己的路徑、自己的聲音。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News