{"id":1396,"date":"2017-08-09T14:27:35","date_gmt":"2017-08-09T17:27:35","guid":{"rendered":"http:\/\/gianfratti.com\/?p=1396"},"modified":"2017-08-10T15:21:59","modified_gmt":"2017-08-10T18:21:59","slug":"asp-net-troubleshooting-investigando-problemas-a-partir-do-browser-com-glimpse","status":"publish","type":"post","link":"https:\/\/gianfratti.com\/index.php\/asp-net-troubleshooting-investigando-problemas-a-partir-do-browser-com-glimpse\/","title":{"rendered":"ASP.NET Troubleshooting: investigando problemas a partir do browser com Glimpse"},"content":{"rendered":"<p>Atualmente os browsers j\u00e1 fornecem diversos recursos ao desenvolvedor para permitir investigar algum comportamento do aplicativo, por exemplo, erro de javascript, p\u00e1gina n\u00e3o encontrada, tempo que cada recurso levou para carregar, conte\u00fado das requisi\u00e7\u00f5es ajax, cache, etc.<!--more--><\/p>\n<p>Em certos cen\u00e1rios de troubleshooting precisamos de ainda mais informa\u00e7\u00e3o, por exemplo, informa\u00e7\u00f5es de trace e log registrados no lado do servidor, comandos SQLs executados, informa\u00e7\u00f5es estas que podem ser expostas diretamente no browser atrav\u00e9s do Glimpse. Ou seja, em tempo real \u00e9 poss\u00edvel acompanhar o funcionamento do aplicativo no lado do servidor pelo pr\u00f3prio browser.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/8b5I9Z9.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse em a\u00e7\u00e3o\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/8b5I9Z9.png\" alt=\"Glimpse em a\u00e7\u00e3o\" width=\"590\" height=\"318\" \/><\/a><\/p>\n<h1>Glimpse<\/h1>\n<p>Site oficial: <a title=\"Glimpse - site oficial\" href=\"http:\/\/getglimpse.com\/\" target=\"_blank\" rel=\"noopener\">http:\/\/getglimpse.com\/<\/a><\/p>\n<p>O Glimpse \u00e9 uma plataforma open-source (Apache 2.0) e gratuita.<\/p>\n<p>Assim que incorporado ao seu aplicativo ASP.NET ele passa a inspecionar as requisi\u00e7\u00f5es web que ocorrem, fornecendo informa\u00e7\u00f5es ao painel de monitoramento no pr\u00f3prio browser sobre o que est\u00e1 acontecendo durante o uso do aplicativo web.<\/p>\n<h1>Cen\u00e1rios de uso<\/h1>\n<p>O Glimpse \u00e9 \u00fatil em uma variedade de cen\u00e1rios de diagn\u00f3stico e an\u00e1lise sobre o comportamento de um aplicativo, como por exemplo:<\/p>\n<ul>\n<li>Identificar os comandos SQLs que est\u00e3o executando no banco de dados ao acessar determinada p\u00e1gina web;<\/li>\n<li>Identificar informa\u00e7\u00f5es de Log e Trace do lado do servidor diretamente no browser;<\/li>\n<li>Acompanhar o tempo de execu\u00e7\u00e3o de cada rotina interna no processamento de uma p\u00e1gina web como forma de investiga\u00e7\u00e3o para melhorar a performace;<\/li>\n<li>Entre muitos outros.<\/li>\n<\/ul>\n<h1>Passo a Passo<\/h1>\n<p>O processo de inclus\u00e3o do Glimpse em um projeto ASP.NET \u00e9 bastante simples, resumindo-se a instalar um pacote Nuget no projeto.<\/p>\n<h2>1) Instalar Glimpse para ASP.NET MVC<\/h2>\n<p>No Package Manager Console (menu Tools &gt; NuGet Package Manager &gt; Package Manager Console) informe \u201cInstall-Package Glimpse.MVC4\u2033 no caso de um projeto ASP.NET MVC 4.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/yduPeZN.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Instalando Glimpse\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/yduPeZN.png\" alt=\"Instalando Glimpse\" width=\"622\" height=\"338\" \/><\/a><\/p>\n<h2>2) Instalar Glimpse para Entity Framework<\/h2>\n<p>Como alternativa tamb\u00e9m \u00e9 poss\u00edvel instalar o complemento do Glimpse para EntityFramework, podendo assim verificar os SQLs que est\u00e3o sendo executados. Para isso digite: Install-Package Glimpse.EF5<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/rfASjqt.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Instalar Glimpse para EntityFramework\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/rfASjqt.png\" alt=\"Instalar Glimpse para EntityFramework\" width=\"664\" height=\"360\" \/><\/a><\/p>\n<h2>3) Ativar o Glimpse<\/h2>\n<p>O Glimpse fica dispon\u00edvel para ativar ou desativar a instrumenta\u00e7\u00e3o atrav\u00e9s do \u201c\/Glimpse.axd\u201d na Url.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/GHufUWR.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Ativar o Glimpse\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/GHufUWR.png\" alt=\"Ativar o Glimpse\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Nesta tela basta acionar o bot\u00e3o \u201cTurn Glimpse On\u201d para ativ\u00e1-lo e \u201cOff\u201d para desativ\u00e1-lo.<\/p>\n<h2>4) Verificar o resultado<\/h2>\n<p>Depois de ativado o Glimpse basta navegar pelo aplicativo web que no rodap\u00e9 ser\u00e1 mostrado diversas informa\u00e7\u00f5es sobre a execu\u00e7\u00e3o da p\u00e1gina.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/0KRcMMZ.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse em a\u00e7\u00e3o\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/0KRcMMZ.png\" alt=\"Glimpse em a\u00e7\u00e3o\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Para ter acesso a mais informa\u00e7\u00f5es basta passar o mouse sobre os itens no rodap\u00e9.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/u2N17N0.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse - mais detalhes\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/u2N17N0.png\" alt=\"Glimpse - mais detalhes\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Al\u00e9m dessas informa\u00e7\u00f5es no rodap\u00e9 \u00e9 poss\u00edvel acessar dados ainda mais detalhados, como por exemplo, o tempo que cada m\u00e9todo da classe levou para executar no servidor.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/6XGtwz2.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse - tempo de execu\u00e7\u00e3o\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/6XGtwz2.png\" alt=\"Glimpse - tempo de execu\u00e7\u00e3o\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Da mesma forma, acessar informa\u00e7\u00f5es de Trace registradas no aplicativo, por exemplo, na Action Index da HomeController registrei uma mensagem que pude consultar diretamente no browser.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/CmXsN0x.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Registrando uma mensagem de Trace\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/CmXsN0x.png\" alt=\"Registrando uma mensagem de Trace\" width=\"416\" height=\"219\" \/><\/a><\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/mjHd4yI.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse - mostrando Trace\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/mjHd4yI.png\" alt=\"Glimpse - mostrando Trace\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Ou mesmo, quais comandos SQLs executaram e quanto tempo cada um levou.<\/p>\n<p><a href=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/sOd91qr.png\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" title=\"Glimpse - mostrando SQLs\" src=\"http:\/\/gianfratti.com\/wp-content\/uploads\/2017\/08\/sOd91qr.png\" alt=\"Glimpse - mostrando SQLs\" width=\"691\" height=\"372\" \/><\/a><\/p>\n<p>Muito show, certo?<\/p>\n<p>At\u00e9 o pr\u00f3ximo!<\/p>\n<p>Fonte: <a href=\"http:\/\/www.rafaelleonhardt.com.br\/2014\/05\/22\/asp-net-troubleshooting-investigando-problemas-a-partir-do-browser-com-glimpse\/\" target=\"_blank\" rel=\"noopener\">Clique aqui<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Atualmente os browsers j\u00e1 fornecem diversos recursos ao desenvolvedor para permitir investigar algum comportamento do aplicativo, por exemplo, erro de javascript, p\u00e1gina n\u00e3o encontrada, tempo que cada recurso levou para carregar, conte\u00fado das requisi\u00e7\u00f5es ajax, cache, etc.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[201,200],"tags":[],"class_list":["post-1396","post","type-post","status-publish","format-standard","hentry","category-net","category-troubleshooting"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/posts\/1396","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/comments?post=1396"}],"version-history":[{"count":4,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/posts\/1396\/revisions"}],"predecessor-version":[{"id":1410,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/posts\/1396\/revisions\/1410"}],"wp:attachment":[{"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/media?parent=1396"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/categories?post=1396"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gianfratti.com\/index.php\/wp-json\/wp\/v2\/tags?post=1396"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}