Aracılığıyla paylaş


Bulut hizmetleri tarafından verilen API isteklerini inceleme

Bir bakışta
Hedef: Bulut hizmeti API isteklerini yerel olarak inceleme
Süre: 20 dakika
Eklentiler:RewritePlugin, DevToolsPlugin
Önkoşullar:Geliştirme Ara Sunucusu, Geliştirme Tünellerini Ayarlama

Uygulamanızı bulut hizmetleriyle tümleştirdiğinizde karşılaşabileceğiniz zorluklardan biri, bulut hizmetinin kullandığı API'lerle nasıl etkileşime geçtiğini anlamaktır. Api isteklerini inceleyebilmek, özellikle sorunları giderirken veya bulut hizmetinin nasıl çalıştığını anlamaya çalışırken önemlidir. Genellikle, bulut hizmetinin çalışma zamanına erişiminiz olmadığından ve bulut API'sinin izleme araçlarına da erişiminiz olmadığından bu zor olabilir. Dev Proxy ve geliştirme tünellerini kullanarak bulut hizmetlerinin bulut API'lerine verdiği API isteklerini inceleyebilirsiniz.

Önemli

Devam etmeden önce geliştirme tünellerini yükleyin ve aracı kullanmak üzere yapılandırın.

Bulut hizmetleri bulut API'lerini nasıl çağırır?

Uygulamanızı bulut hizmetleriyle tümleştirdiğinizde bulut hizmeti API'nizi bulutta çağırır. Aşağıdaki diyagramda bu senaryo gösterilmektedir:

Bulut hizmetinin bulut API'sini nasıl çağırdığını gösteren diyagram.

Bulut hizmetinin karşılaştığı API isteklerini incelemek için bulut API'sinin izleme araçlarına erişmeniz gerekir. Genellikle bu araçlara erişemezsiniz. Bir hazırlama ortamı kullanarak bu sınırlamaya geçici bir çözüm sağlayabilirsiniz. Ancak, bir hazırlama ortamı ayarlamak ve bakımını yapmak zaman alır. Dahası, bulut API'sine sahip değilseniz bir hazırlama ortamı ayarlayamayabilirsiniz.

Geliştirme Proxy'si ve geliştirme tünellerini kullanarak API isteklerini inceleme

Dev Proxy ve geliştirme tünellerini kullanarak bulut hizmetinin bulut API'sine verdiği API isteklerini inceleyebilirsiniz.

Geliştirme tünellerini ve Geliştirme Ara Sunucusunu kullanarak bulut API çağrılarını nasıl inceleyebileceğinizi gösteren diyagram.

Bulut API'sini doğrudan çağırmak yerine, bulut hizmetini yerel makinenizde çalıştırdığınız geliştirme tünelini (1) çağıracak şekilde yapılandırabilirsiniz. Geliştirme tünelini, Dev Proxy'nin yakaladığı bir konak üst bilgisi kullanacak şekilde yapılandırırsınız. Bulut hizmeti geliştirme tünelini her çağırışında, isteği kesmesini sağlayan Dev Proxy'ye geçirir (2). Dev Proxy RewritePlugin kullanarak, kesilen isteğin URL'sini değiştirir ve bulut API'sine (3) iletirsiniz. Bulut API'si isteği işler ve Geliştirme Proxy'sine (4) bir yanıt döndürür. Dev Proxy, yanıtı bulut hizmetine (6) ileten geliştirme tüneline (5) geçirir. İstek yerel makineniz üzerinden yönlendirildiğinden URL, üst bilgiler ve gövde gibi bilgilerini ve bulut API'sinden gelen yanıtı inceleyebilirsiniz.

Senaryo

Bir bulut hizmetinin konumundaki https://jsonplaceholder.typicode.comdemo JSONPlaceholder API'sine yönelik api isteklerini incelemek istediğinizi varsayalım. Dev Proxy ve geliştirme tünellerini birleştirerek istekleri engelleyebilir ve bilgilerini inceleyebilirsiniz.

İstekleri, geliştirme tünelleri inceleme araçlarını veya Dev Proxy DevToolsPlugin kullanarak inceleyebilirsiniz. Her iki araç da yakalanan istekler ve yanıtlar hakkındaki bilgileri göstermek için Chrome DevTools'u kullanır. Geliştirme tünelleri inceleme araçlarını kullandığınızda, istek URL'si olarak geliştirme tüneli URL'sini görürsünüz. Karşılaştırıldığında, Dev Proxy DevToolsPlugin kullandığınızda, yerel veya yeniden yazılmış URL'yi kullanarak Development Proxy'nin isteği nasıl kestiğini görürsünüz.

Dev Proxy, dev tünelleri ve dev tünelleri inceleme araçlarını kullanarak API isteklerini inceleme

  1. https://jsonplaceholder.typicode.com ve http://jsonplaceholder.typicode.local isteklerini engellemek için Geliştirme Proxy'sini yapılandırın:

    Dosya: devproxyrc.json

    {
      "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rc.schema.json",
      "plugins": [
        {
          "name": "RewritePlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
          "configSection": "rewritePlugin"
        }
      ],
      "urlsToWatch": [
        "https://jsonplaceholder.typicode.com/*",
        "http://jsonplaceholder.typicode.local/*"
      ],
      "rewritePlugin": {
        "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rewriteplugin.schema.json",
        "rewritesFile": "devproxy-rewrites.json"
      },
      "logLevel": "information",
      "newVersionNotification": "stable",
      "showSkipMessages": true
    }
    

    Yapılandırma dosyası, kesilen isteklerin URL'sini yeniden yazmak için RewritePlugin kullanır. Ayrıca https://jsonplaceholder.typicode.com ve http://jsonplaceholder.typicode.local URL'lerine yönelik istekleri kesmek için Dev Proxy'yi yapılandırır.

    Not

    .local etki alanı kullanmak gerekli olmasa da, gerçek ve engellenmiş istekleri ayırt etmeye yardımcı olan iyi bir uygulamadır. Ayrıca, .local etki alanı için HTTPS yerine HTTP protokolünü kullandığınıza da dikkat edin. Geliştirme tünelleri, istekleri yerel makinenizdeki özel konak üst bilgilerine yönlendirmek için HTTPS'yi desteklemez. Bu nedenle HTTP kullanmanız gerekir.

  2. Kesilen isteklerin URL'sini değiştiren adlı devproxy-rewrites.json bir yeniden yazma dosyası oluşturun:

    Dosya: devproxy-rewrites.json

    {
      "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rewriteplugin.rewritesfile.schema.json",
      "rewrites": [
        {
          "in": {
            "url": "^http://jsonplaceholder.typicode.local(.*)"
          },
          "out": {
            "url": "https://jsonplaceholder.typicode.com$1"
          }
        }
      ]
    }
    

    Yeniden yazma dosyası, kesilen isteklerin URL'sini http://jsonplaceholder.typicode.local'den https://jsonplaceholder.typicode.com'e değiştirir.

  3. Komut satırında devproxyçalıştırarak Dev Proxy'yi başlatın.

    Dev Proxy'nin çalıştığı komut satırının ekran görüntüsü.

  4. komut satırında devtunnel host --host-header jsonplaceholder.typicode.local --port-numbers 8000 --allow-anonymousçalıştırarak geliştirme tünelini başlatın.

    Dev Proxy ve geliştirme tüneli çalıştıran komut satırının ekran görüntüsü.

    Bu komutu kullanarak makinenizde yeni bir geliştirme tüneli açarsınız. Bunu, Dev Proxy'nin gelen istekleri dinlediği 8000 bağlantı noktasıyla eşlersiniz. Ayrıca, Dev Proxy'nin araya girerek engellediği ana makine üst bilgilerini belirtirsiniz.

  5. Bulut hizmetini yerel makinenizi çağıracak şekilde yapılandırmak için kullanabileceğiniz geliştirme tüneliNIN URL'sini not edin, örneğin https://tunnel_id-8000.euw.devtunnels.ms.

  6. Web tarayıcısında geliştirme tüneli inceleme URL'sini açın, örneğin https://tunnel_id-8000-inspect.euw.devtunnels.ms.

  7. Komut satırında çalıştırarak geliştirme tüneli URL'sini kullanarak bulut API'sini çağıran bir bulut hizmetinin simülasyonunu yapın. curl https://tunnel_id-8000.euw.devtunnels.ms/posts/1

    Not

    Ana bilgisayar adının makinenizdeki geliştirme tünelinin URL'sine karşılık geldiğini unutmayın. Yol, incelemek istediğiniz API'nin yoluyla eşleşir.

    Dev Proxy ve geliştirme tüneli çalıştıran ve geliştirme tünelini çağıran komut satırının ekran görüntüsü.

  8. Dev Proxy'nin isteği nasıl kestiğine ve bulut API'sine nasıl ilettiğine dikkat edin ve sonunda yanıtı istemciye döndürür.

  9. Web tarayıcısında, durdurulan istek ve bulut API'sinden gelen yanıt hakkındaki bilgilere dikkat edin.

    Kesişen isteği gösteren geliştirme tüneli inceleme araçlarını içeren bir web tarayıcısının ekran görüntüsü.

    Not

    Kaydedilen istek URL'sinin geliştirme tünelinin URL'si olduğuna dikkat edin. Kaydedilen konak üst bilgisi, Dev Proxy'nin kestiği konak üst bilgisidir.

  10. Komut satırında, ilgili oturumlarda Ctrl+C'ye basarak geliştirme tünelini kapatın ve Dev Proxy'yi durdurun.

Dev Proxy ve DevToolsPlugin kullanarak API isteklerini inceleme

Bulut hizmetinin karşılaştığı API isteklerini incelemenin bir diğer yolu da Dev Proxy DevToolsPlugin kullanmaktır. DevToolsPlugin ile geliştirme tünelleri inceleme araçlarının kullanılması arasındaki fark, DevToolsPlugin'in Yerel url'yi veya yeniden yazılan URL'yi kullanarak Dev Proxy'nin isteği nasıl kestiğini göstermesidir.

DevToolsPlugin'i kullanarak ele geçirilen URL aracılığıyla API isteklerini incelemek için Dev Proxy yapılandırması yapın.

İlk olarak, Bulut API'si isteklerini incelemek için Dev Proxy'yi yapılandıralım. Geliştirme Proxy'si yeniden yazmadan önce URL hakkındaki bilgileri göstermek için DevToolsPlugin'i yapılandıralım.

  1. DevToolsPlugin'i kullanmak için Dev Proxy yapılandırma dosyasını güncelleştirin:

    Dosya: devproxyrc.json

    {
      "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rc.schema.json",
      "plugins": [
        {
          "name": "DevToolsPlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll"
        },
        {
          "name": "RewritePlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
          "configSection": "rewritePlugin"
        }
      ],
      "urlsToWatch": [
        "https://jsonplaceholder.typicode.com/*",
        "http://jsonplaceholder.typicode.local/*"
      ],
      "rewritePlugin": {
        "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rewriteplugin.schema.json",
        "rewritesFile": "devproxy-rewrites.json"
      },
      "logLevel": "information",
      "newVersionNotification": "stable",
      "showSkipMessages": true
    }
    

    Not

    RewritePlugin'in önüne DevToolsPlugin'i eklediğimize dikkat edin. DevToolsPlugin'i önce ekleyerek, yeniden yazılmadan önce engellenen istek hakkındaki bilgileri gösterir.

  2. Komut satırında devproxyçalıştırarak Dev Proxy'yi başlatın. Dev Proxy'nin Chrome Geliştirme Araçları'nın görünür olduğu bir web tarayıcısı penceresi açtığına dikkat edin.

  3. komut satırında devtunnel host --host-header jsonplaceholder.typicode.local --port-numbers 8000 --allow-anonymousçalıştırarak geliştirme tünelini başlatın.

  4. Komut satırında çalıştırarak geliştirme tüneli URL'sini kullanarak bulut API'sini çağıran bir bulut hizmetinin simülasyonunu yapın. curl https://tunnel_id-8000.euw.devtunnels.ms/posts/1

  5. Chrome Geliştirme Araçları ile web tarayıcısında, kesilen istek ve bulut API'sinden gelen yanıt hakkındaki bilgilere dikkat edin.

    Araya alınan isteği gösteren Geliştirici Ara Sunucusu denetleme araçlarını içeren bir web tarayıcısının ekran görüntüsü.

    Not

    Kaydedilen istek URL'sinin bulut API'sinin URL'si olduğuna dikkat edin. Kaydedilen konak üst bilgisi, Dev Proxy'nin kestiği konak üst bilgisidir.

  6. Komut satırında, ilgili oturumlarda Ctrl+C'ye basarak geliştirme tünelini kapatın ve Dev Proxy'yi durdurun.

Dev Proxy'yi, yeniden yazılan URL'yi kullanarak API isteklerini incelemek için DevToolsPlugin kullanacak şekilde yapılandırma

Şimdi, yeniden yazılan URL hakkındaki bilgileri göstermek için Dev Proxy yapılandırmasını güncelleştirelim.

  1. DevToolsPlugin'i RewritePlugin'in ardından taşıyarak Dev Proxy yapılandırma dosyasını güncelleştirin:

    Dosya: devproxyrc.json

    {
      "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rc.schema.json",
      "plugins": [
        {
          "name": "RewritePlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
          "configSection": "rewritePlugin"
        },
        {
          "name": "DevToolsPlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll"
        }
      ],
      "urlsToWatch": [
        "https://jsonplaceholder.typicode.com/*",
        "http://jsonplaceholder.typicode.local/*"
      ],
      "rewritePlugin": {
        "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rewriteplugin.schema.json",
        "rewritesFile": "devproxy-rewrites.json"
      },
      "logLevel": "information",
      "newVersionNotification": "stable",
      "showSkipMessages": true
    }
    
  2. Komut satırında devproxyçalıştırarak Dev Proxy'yi başlatın. Dev Proxy'nin Chrome Geliştirme Araçları'nın görünür olduğu bir web tarayıcısı penceresi açtığına dikkat edin.

  3. komut satırında devtunnel host --host-header jsonplaceholder.typicode.local --port-numbers 8000 --allow-anonymousçalıştırarak geliştirme tünelini başlatın.

  4. Komut satırında çalıştırarak geliştirme tüneli URL'sini kullanarak bulut API'sini çağıran bir bulut hizmetinin simülasyonunu yapın. curl https://tunnel_id-8000.euw.devtunnels.ms/posts/1

  5. Chrome Geliştirme Araçları ile web tarayıcısında, kesilen istek ve bulut API'sinden gelen yanıt hakkındaki bilgilere dikkat edin.

    Bulut API'si URL'leri ile kesilen isteği gösteren Dev Proxy denetleme araçlarıyla bir web tarayıcısının ekran görüntüsü.

    Not

    Hem kaydedilen istek URL'sinin hem de konak üst bilgisinin bulut API'sinin URL'sini gösterdiğine dikkat edin.

  6. Komut satırında, ilgili oturumlarda Ctrl+C'ye basarak geliştirme tünelini kapatın ve Dev Proxy'yi durdurun.

Özet

Dev Proxy ve geliştirme tünellerini kullanarak bulut hizmetlerinin bulut API'lerine verdiği API isteklerini inceleyebilirsiniz. İstekleri incelemek için geliştirme tünelleri inceleme araçlarını veya Dev Proxy DevToolsPlugin'i kullanabilirsiniz. Her iki araç da URL, üst bilgiler ve gövde ile bulut API'sinden gelen yanıt dahil olmak üzere kesilen isteklerle ilgili bilgileri gösterir. Dev Proxy ve geliştirme tünellerini kullanarak bulut hizmetlerinin bulut API'leriyle nasıl etkileşime geçtiğini daha iyi anlayabilir ve sorunları daha etkili bir şekilde giderebilirsiniz.

Sonraki adımlar

RewritePlugin hakkında daha fazla bilgi edinin.

Ayrıca bakınız