雖然不用花錢,不過必須花時間跑模擬器,電腦的 CPU 要夠強,記憶體要夠多,否則模擬器會很卡。
MacOS 官方提供了一個強大的開發工具 Xcode,可以很正確地模擬 iPhone、iPad 的使用環境。我經過實測後發現,一些 iOS 才會發生的網頁錯誤,Xcode 是真的可以模擬出來的。
這樣子的錯誤,光是使用 Chrome 開發人員工具模擬不出來,那麼以下就來看看如何在 Windows 下藉著模擬器執行 Xcode 進行除錯。
(圖片出處: apple.com)
一、WMware 模擬器
- 首先假設讀者的硬體設備都準備妥當了,否則請放棄這個方案。
- 請詳讀「Windows 用 VMware Player 模擬 MAC OS X 心得」內容
- 從「三、準備相關工具」下載及安裝好 WMware
- 蘋果系統映像檔請想辦法取得
- 如有 FB 帳號可免費加入本站會員,看到隱藏內容連結
按照以上流程處理完後,很重要的一點是記住你使用的蘋果系統版本,例如「Yosemite 10.10」,之後會用到。
二、下載 Xcode
1. Xcode 版本
如果 MacOS 版本很新,Xcode 可在 App Store 自動下載對應的版本。
否則的話,不同的 MacOS 版本只能對應特定版本的 Xcode,可參考此資訊:
必須說這個表可以參考,但可能無法 100% 正確,例如我的版本 Yosemite 10.10,不過 Xcode 的版本一直下載、不斷降版本,直到嘗試了 6.0.1 才能安裝。
2. 下載 Xcode
如果到蘋果官網下載,很難找到各種 Xcode 版本的連結頁面,通常只能找到最新版本。以下提供幾個連結,可不必這麼麻煩,請找自己需要的版本下載:
下載之前,先準備好自己的 Apple ID 帳號密碼,沒有的話先申請一個。
三、利用 Xcode 進行除錯
1. 打開模擬器
安裝完 Xcode 後,可參考這篇「沒舊版iOS測APP?仿真百分百iPhone模擬器」開啟 iOS 模擬器。
例如模擬 iPhone 後,點擊 iPhone 桌面上的 Safari 瀏覽器,進入要 Debug 的網址:
2. 開始除錯
接者開啟 VMware 模擬的 MacOS 系統中的 Safari 瀏覽器:
如上圖 Develop → iOS Simulator → Safari → 選擇開啟的網址
接下來就能使用 Safari 對著 Xcode 模擬的 iPhone 進行偵錯了。
以上就是沒有任何實體蘋果裝置的開發人員處理方案,一時之間找不到機器除錯時,是個很好的備用方案。
更多 iOS 相關技巧:
感謝您的指引,我順利用VMware開啟了Mac OS
回覆刪除有幾件事情需要注意的
1. 我用VirtualBox開啟VMDK,但是失敗了。還是得要用VMware才行。
2. 如果VMware開啟Mac OS時一直停留在開機畫面,無法進入桌面的話,那就是Unlocker沒有裝好。確認Unlocker正確安裝後,就能順利進入桌面。
3. 如果Mac OS的版本太舊,iOS Simulator就只能模擬舊裝置。舊裝置不支援一些較新的JavaScript語法,例如let或箭頭函數。
但我們修改vmx檔案,將虛擬機器設定為較新的硬體,這樣就能下載新的Mac OS版本
https://techsviewer.com/how-to-upgrade-macos-catalina-in-virtual-machine-to-the-latest-version/
4. 即使更新了Mac OS,我還是不能從App Store下載Xcode。還是要另外直接下載才行:
https://stackoverflow.com/questions/10335747/how-to-download-xcode-dmg-or-xip-file
5. 目前我更新到Mac OS 10.15.2,安裝對應版本的Xcode之後,可以順利模擬iPhone 11等較新的裝置。但是Xcode的開發功能有變更,我現在找不到怎麽開啟Web Inspector,仍在研究中。
補充一下:
刪除在模擬器裡面用iPhone測試的時候,我發現還是有些地方跟實機iPhone操作的結果還是不一樣
似乎是ontouch事件跟onclick事件之間的順序之類的問題,我沒有仔細釐清
因為模擬器跟實機差異的地方不少,我試了一陣子之後就放棄模擬器了 QAQ
說好的HTML5跨平臺呢orz