iOS App Development

iOS WebView Debugging

April 28, 2023
Share

Cihazda safari ve uygulamada kullandığımız webview içeriğinin bilgisayar üzerinden debug edilmesi.

iOS WebView Debugging

Webview kullanılan projelerde sayfaları ve JavaScriptleri debug ederek web sayfasındaki hataları giderebilmekteyiz. Bunun için cihazı bilgisayarınıza bağlamanız ve tarayıcınızın geliştirici ayarlarını kullanmanız gerekmektedir.

iOS Web Görünümlerinde Hata Ayıklama

iOS webviewde web sayfasındaki console.log() mesajları Xcode log’larında görüntülenememektedir. Bunun için Safari’nin geliştirici ayarlarını kullanarak kolaylıkla log’ları ve hata ayıklamalarını yapabilmekteyiz.

  • iOS web görünümlerinde hata ayıklamak için Safari gerekir, bu nedenle geliştirici bilgisayarınızda macOS çalışıyor olmalıdır.
  • Web görünümlerinde yalnızca Xcode aracılığıyla cihazınıza yüklenen uygulamalarda hata ayıklayabilirsiniz. App Store veya Apple Configurator aracılığıyla yüklenen uygulamalarda web görünümlerinde hata ayıklayamazsınız.

Bu sınırlamaları göz önünde bulundurarak, iOS’ta bir web görünümünde uzaktan hata ayıklama adımları şunlardır:

  1. İlk olarak, iOS Ayarları uygulamasını açıp Settings > Safari > Advanced (Ayarlar > Safari > Gelişmiş’e) giderek ve Web Denetçisi seçeneğini açık konuma getirerek iOS cihazınızda Safari Web Inspector (Web Denetçisini) etkinleştirin.
Settings > Safari > Advanced

2. Ardından, geliştirmeyi yaptığınız bilgisayarınızda Safari’de geliştirici araçlarını da etkinleştirmelisiniz. Geliştirme bilgisayarınızda Safari’yi başlatın ve menü çubuğunda Safari > Preferences (Safari > Tercihler’e) gidin. Görüntülenen tercihler bölmesinde, Gelişmiş sekmesine tıklayın ve ardından alttaki Show Develop (Geliştirmeyi Göster) menü seçeneğini etkinleştirin. Bunu yaptıktan sonra tercihler bölmesini kapatabilirsiniz.

Show Develop

3. iOS cihazınızı geliştirici bilgisayarınıza bağlayın ve uygulamanızı veya safari başlatın.

4. Geliştirici bilgisayarınızdaki Safari’de, menü çubuğunda Develop (Geliştir’e) tıklayın ve iOS cihazınızda çalışan webview örneklerinin bir listesini göstermek için iOS cihazınızın adını seçin.

Safari Develop

5. Hatalarını ayıklamak istediğiniz web görünümü için açılır seçeneği tıklayın. Bu, web görünümünü incelemek için yeni bir Safari Web Denetçisi penceresi açacaktır.

Web Inspector

Author: Atakan Cengiz Kurt

Tags

Debugging iOS WebView
Other Posts
SEE ALL POSTS
Consultancy
October 3, 2023
Understanding Retail Loans: A Simple Guide
Consultancy
September 7, 2023
Agile’da İş Analistinin Rolü: Planlama ve Takip
Consultancy
August 26, 2023
Agile’da Scrum Master’ın Rolü ve Önemi
Consultancy
July 27, 2023
Açık Bankacılık Ürün Yolculuğu
Android App Development
July 24, 2023
Last Six Months Programming With Github Copilot As An Android Developer
Consultancy
July 10, 2023
Our success story with a large bank: Digital Infrastructure Transformation
Consultancy
July 4, 2023
Main Advantages and Disadvantages of Remote Work
iOS App Development
May 17, 2023
Stepper component design using UIBezierPath with Swift
Android App Development
January 16, 2023
Android Build Types and Product Flavors
Data
July 28, 2022
Bulut Servislerindeki Hizmet Türleri (IaaS, PaaS, SaaS)
Data
July 27, 2022
Azure SQL Dağıtım Türleri
Front end Development
July 26, 2022
The Proper Way to Use Styling in React.js
Front end Development
July 18, 2022
useMemo ve useCallback
Front end Development
July 5, 2022
React Folder Structure Deep Dive
Mobile Application Development
June 30, 2022
Flutter Clean Architecture with Rorty App
Front end Development
June 27, 2022
How to Connect Firebase Realtime Database to a React App
Software Development
June 14, 2022
Şiir gibi Paketleme Yöneticisi: Poetry!
Presentation Skills
May 30, 2022
How “NOT” to Make a Presentation?
Android App Development
March 21, 2022
Jetpack Compose: Migration to Gradle Kotlin DSL
Android App Development
February 14, 2022
App Shortcuts on Android
Android App Development
January 27, 2022
Introduction to Jetpack Compose
Android App Development
January 19, 2022
Android View Binding using in Activity, Fragment, Dialog, View, RecyclerViewHolder
Android App Development
January 3, 2022
Why should we use Kotlin for Android app development?
iOS App Development
December 21, 2021
Apple’ın 3D Touch’ı nedir, nasıl çalışır ve uygulamanıza nasıl entegre edilir?
iOS App Development
December 14, 2021
Uygulama içeriğinize Core Spotlight nasıl eklenir?
Consultancy
October 18, 2021
Get out of your comfort zone to see what you did not even know existed!
Tools for Analysts
September 5, 2021
Bir İş Analistinin Kullanabileceği Temel Araçlar Nelerdir?
Requirement Analysis
September 2, 2021
Gereksinimleri Açık ve Net Yazmanın İpuçları
iOS App Development
August 24, 2021
Apple Push Notifications – Pem Dosyası Oluşturma
Deno
May 14, 2020
Deno Nedir? Node.js‘in Yerini Alabilecek mi?
Source Code Management
March 9, 2020
Source Code Management: TFS vs. GitLab vs. Gerrit
Software Development
February 24, 2020
NPM vs. YARN vs. PNPM
Front end Development
December 19, 2019
React Hook(Kanca) Geçişi
CSS
December 2, 2019
Background Slider with react-transition-group
Front end Development
October 10, 2019
Blocking Rendering’in Sonu: Concurrent Mode
Data
October 23, 2018
Power BI Nedir? Bileşenleri ve Lisans Türleri Nelerdir?

In order to enable some website functionality and provide best possible experience for you, we use cookies. For more information, please review our Cookie Policy.