Site icon Blog ARC Optimizer

Fiddler pour les développeurs Xamarin


Fiddler est le proxy réseau bien-aimé de nombreux développeurs. Nous regardons sous les couvertures pour explorer comment Fiddler peut bénéficier aux développeurs mobiles.

Les développeurs ne devraient jamais avoir de doute sur ce qui se passe dans la pile réseau. Cependant, cela est plus facile à dire qu'à faire aujourd'hui, avec la pléthore de plates-formes pour lesquelles les développeurs doivent construire. La création de facteurs de forme mobiles continue de présenter des défis avec la couche réseau, en particulier avec les variantes de système d'exploitation et d'appareils de la plate-forme. Les développeurs ont besoin d'une interface visuelle cohérente pour la productivité et doivent exiger la visibilité du trafic réseau lors de la construction pour mobile. Il n'y a qu'une seule façon d'y parvenir – regardez sous les couvertures.

Entrez Fiddler – le proxy de débogage Web gratuit pour tout navigateur, système ou plate-forme. Fiddler a été extrêmement populaire dans la communauté des développeurs et a beaucoup évolué au fil des ans. Voyons comment Fiddler peut atténuer la douleur de la pile réseau pour les développeurs mobiles, en particulier les Xamarin multiplateformes.

Pourquoi Fiddler

La nécessité d'inspecter le trafic réseau n'est pas nouvelle et au fil des ans, de nombreux outils ont été construit pour les développeurs. La beauté de Chrome DevTools est disponible pour tout développeur utilisant les navigateurs Google Chrome ou Microsoft Edge sur n'importe quel système d'exploitation. Si vous travaillez avec des API Web, Postman fournit un excellent moyen de créer, tester, authentifier, simuler et valider des points de terminaison d'API. Cependant, tous ces outils sont destinés au Web – qu'en est-il du développement mobile ou de bureau? Comment les développeurs regardent-ils le trafic réseau lorsque le système d'exploitation de la plate-forme exécutant les applications est une boîte noire?

C'est l'un des plus grands avantages que Fiddler et le nouveau Fiddler Everywhere apportent à la table – visibilité de la pile réseau pour tous les types de développement d'applications, en particulier pour les développeurs mobiles. Plongeons dedans.

Thy Shall Not Pass

Il s'avère que rien ne vaut la flexibilité d'une visibilité complète du réseau, quel que soit le type de développeurs d'applications qui construisent. Et pour cela, il faut passer sous les couvertures et utiliser un proxy réseau. Toutes les communications réseau passent par un seul proxy, permettant ainsi aux développeurs une visibilité complète. C'est exactement là où Fiddler brille et il existe plusieurs façons d'activer les flux de travail Fiddler, quelle que soit la plate-forme. Les développeurs sur Windows apprécient depuis longtemps le Fiddler original, une solution réseau mature riche en fonctionnalités. Et maintenant, grâce à Fiddler Everywhere, les développeurs sur Mac OS ou Linux peuvent profiter du même amour.

Présentons donc l'expérience d'un développeur mobile sur Mac OS utilisant le moderne Fiddler Everywhere . Comme mentionné, Fiddler est un véritable proxy réseau pour une flexibilité maximale et exige que tout le trafic réseau passe par Fiddler, bien que temporairement. Lors du premier lancement, votre système d'exploitation est susceptible de vous avertir que vos paramètres réseau sont en cours de modification – c'est correct, et les choses reviennent aux paramètres normaux une fois que Fiddler est fermé. L'une des choses révélatrices pour les nouveaux utilisateurs de Fiddler en tant que proxy réseau est la quantité de trafic réseau – la plupart des applications de tous les jours deviennent très bavardes et appellent souvent à la maison. Et les sites Web populaires d'aujourd'hui nécessitent un bon nombre d'appels réseau pour afficher la première vue, ce qui explique pourquoi les développeurs mobiles ont pris conscience des restrictions de bande passante et du temps avant le premier chargement des applications Web.

Je vous vois

Un gros avantage que Fiddler apporte à la table est la possibilité d'inspecter toute activité réseau – et cela inclut également la plupart du trafic HTTPS. Tout ce que vous avez à faire est d'aller dans Paramètres et de cocher la case pour décrypter le trafic HTTPS, comme ci-dessous. Désormais, les capacités d'interception HTTPS de Fiddler font (à juste titre) monter les sourcils parmi les utilisateurs soucieux de la sécurité. Essentiellement, le proxy Fiddler exécute une attaque d'homme au milieu pour usurper le trafic sécurisé – c'est très technique et fait avec une responsabilité extrême.

Fake It Till You Make It Work

Presque tout type d'application moderne qui communique avec Internet le fait en grande partie en utilisant des API – des wrappers sur des points de terminaison qui donnent accès à quelque chose de précieux. Et une grande majorité des API Web honorent les verbes HTTP pour fournir des actions uniques sur les données. Quel que soit le type d'application que vous construisez, Fiddler Everywhere est vraiment bon pour tester les API avec son compositeur. Vous pouvez pointer vers n'importe quelle URL – locale ou Internet, et pouvoir déclencher des demandes personnalisées pour n'importe quel verbe HTTP.

Apple a Day

Très bien, entrons dans les détails de l'utilisation de Fiddler Everywhere lorsque vous créez des applications mobiles – en commençant par les appareils Apple. MacOS dispose de merveilleux simulateurs pour les appareils iOS – iPhones, iPads, OS de télévision et OS de montre. Avec Fiddler Everywhere exécuté en tant que proxy réseau, ouvrez simplement un simulateur iOS et ouvrez le navigateur Safari intégré. Lorsque vous accédez à une URL, Fiddler capture fidèlement le trafic, comme ci-dessous.

Works Under My Shell

Donc, une fois que vous commencez à créer des applications natives pour iOS, il est impératif de voir comment votre code dans l'application gère les appels réseau. Grâce à Fiddler agissant en tant que proxy réseau, cela est trivial – iOS Simulator finit par utiliser le même réseau que votre ordinateur. Imaginons que vous ayez choisi Xamarin.Forms pour créer des applications mobiles multiplateformes véritablement natives – tout d'abord, bravo pour une grande sélection de piles technologiques. Avant de commencer à créer quelque chose de complexe, la première chose à faire est de vérifier si Fiddler capture du trafic depuis l'application. Le moyen le plus rapide de vérifier consiste à lancer le composant de navigateur Web et à naviguer vers une URL dans l'application. Xamarin.Forms propose l'abstraction WebView – nous en faisons simplement l'intégralité de l'interface utilisateur dans notre application et relevons Fiddler lors du chargement de tout site Web public. Voila, trafic capturé.

 public partial class MainPage: ContentPage
{
    public MainPage ()
    {
        InitializeComponent ();

        WebView webView = nouveau WebView
        {
            Source = "https://www.telerik.com/fiddler",
            HorizontalOptions = LayoutOptions.FillAndExpand,
            VerticalOptions = LayoutOptions.FillAndExpand
        };

        this.Content = new StackLayout
        {
            Enfants = {webView}
        };
    }
} 

Je sais ce que vous avez fait dans l'application

Maintenant que nous avons prouvé que le proxy Fiddler capture en fait tout le trafic généré par le code personnalisé dans une application native, nous pouvons avoir beaucoup plus de confiance dans le code qui déclenche les appels réseau. Essayons un scénario simple – une application Xamarin.Forms effectuant un appel d'API réseau et recevant des données d'un point de terminaison de service. Imaginons également que nous sommes riches et célèbres – et volons dans des jets personnels. Qui se soucie de l'environnement de toute façon? Votre compagnie de jet privé fournit une application iOS native où vous pouvez rechercher les jets les plus proches en fonction de votre emplacement physique. Voici quelques exemples de XAML pour rendre une interface utilisateur trop simplifiée:



    
        
            
            
            
            
            
        
    

Une fois que l'utilisateur déclenche une demande pour trouver les endroits les plus proches, nous invoquons un point de terminaison Azure Functions en passant un code d'aéroport et en attendant des données. Voici le code:

 classe partielle publique AnotherPage: ContentPage
{
    chaîne de const privée AzureFunctionURL = "https: //  .azurewebsites.net / api / findplanes / airport / {airport}";
    Client HttpClient privé = nouveau HttpClient ();

    public AnotherPage ()
    {
        InitializeComponent ();
    }

    GetPlanes async void privé ()
    {
        essayer
        {
            var Endpoint = AzureFunctionURL.Replace ("{airport}", this.Airport.Text);
            var FunctionResponse = attendent Client.GetStringAsync (Endpoint);
            this.AvailablePlanes.Text = FunctionResponse.ToString ();
        }
        catch (Exception)
        {
            // Échoue bien.
        }
    }

    void Button_Clicked (expéditeur System.Object, System.EventArgs e)
    {
        GetPlanes ();
    }
} 

Les calculs magiques dans la fonction cloud pour trouver les avions les plus proches ne sont pas importants. L'important est de savoir si nous pouvons capturer ce trafic dans Fiddler – bien sûr!

Interface utilisateur Telerik pour Xamarin . Vous pouvez la récupérer sur l'App Store et le code source complet est ouvert / téléchargeable. Vous pouvez jouer avec avec une véritable application qui se trouve dans les magasins et une interface utilisateur polie. Lorsque vous l'exécutez localement, vous pouvez voir différentes parties de l'application passer des appels réseau que Fiddler capture fidèlement. . Le Travel Assistance Bot, par exemple, fonctionne avec un service de Bot hébergé dans Azure et l'application utilise l'API DirectLine pour communiquer avec le Bot – sans se cacher de Fiddler de toute façon.

Partenariat avec Droids

Cibler Android comme plate-forme mobile? Fiddler est heureux d'être un fidèle compagnon de vos besoins de débogage en regardant la pile réseau. Besoin de voir le trafic depuis un appareil Android dans Fiddler? Mettez simplement l'ordinateur et l'appareil mobile sur le même réseau WiFi avec Fiddler comme proxy réseau. Une façon sûre de résoudre les problèmes potentiels est l'inversion du contrôle – allumez le point d'accès de l'appareil Android et attachez l'ordinateur à l'appareil. Si vous exécutez des simulateurs / émulateurs Android sur un ordinateur, la configuration est très similaire à celle d'iOS – ajustez les paramètres de proxy pour qu'ils correspondent aux IP / ports utilisés par Fiddler, comme ceci:

Conclusion

Fiddler est depuis longtemps le proxy réseau bien-aimé de nombreux développeurs. Et aucun autre type de développement ne bénéficie plus avec Fiddler que la construction pour des facteurs de forme mobiles. Avec une pléthore de plates-formes mobiles et de variantes d'appareils, les développeurs ont besoin d'un véritable proxy réseau pour avoir une visibilité complète – Fiddler est heureux d'obliger.

Fiddler Classic a toujours été et continuera d'être un client Windows riche en fonctionnalités pour faciliter tout type de développement mobile. Fiddler Everywhere est la nouvelle solution multiplateforme qui fonctionne de manière transparente sur Windows / Mac / Linux et promet la prise en charge de presque toutes les plates-formes mobiles que les développeurs peuvent cibler. Qu'est-ce qui vous retient de la prochaine solution mobile étonnante?





Source link
Quitter la version mobile