10 suggerimenti per la costruzione di un App per Windows Phone

Noi tutti amiamo i dispositivi. È un dato di fatto, una delle prime persone fanno le cose con un telefono PC o tablet è di personalizzarlo. Cambiamo sfondi, installare applicazioni, cambiare la suoneria, il tutto per rendere "personalmente la mia." Nel corso dell'ultimo anno, come l'ecosistema applicazione è cresciuta, come pure il numero di applicazioni disponibili. Anche se gli strumenti di sviluppo per la piattaforma Windows Phone sono i migliori del settore per la costruzione di applicazioni mobili, la gamma qualità delle applicazioni sviluppate per Windows Phone è simile ad altre piattaforme. In questo articolo, esploreremo alcuni "trucchi" di sviluppo e capire perché alcune applicazioni (a parte i contenuti) ottenere la risposta dei clienti maggiore di altri. Alcuni problemi sono relativi al codice, mentre altri sono di design-based.

Regola n. 1: Embrace Metro
Per la maggior parte degli smartphone - escluso Windows Phone - la realtà è che al di là di qualche magia stile, sono, in generale, lo stesso. Ognuno ha cromo, indicatori di stato, l'impaginazione, icone delle applicazioni e così via. Questa comunanza a volte porta alla domanda: "Cosa dovrebbe apparire come la mia domanda?" Che cos'è una decisione apparentemente semplice per alcuni è estremamente difficile per gli altri. Alcuni editori per scontato che tutti gli utenti su tutte le piattaforme vuole, o necessità, l'applicazione per lo stesso aspetto. Ciò è comprensibile, ma un presupposto non corretto nella maggior parte dei casi.

Come Phone Microsoft ha progettato Windows, ci sono voluti un approccio diverso da altri smartphone. L'idea di un'applicazione mobile con la sensazione sguardo, e la funzionalità di una applicazione per iPhone di essere utilizzato su Windows Phone sembra innaturale. Allo stesso modo, un'applicazione Windows Phone sarebbe del tutto fuori luogo su un iPhone. Questo porta alla nostra prima regola di sviluppo Windows Phone: Embrace, piuttosto che combattere, l'interfaccia in stile Metro. La vostra applicazione si sentirà naturale a qualsiasi consumatore che usa Windows Phone.

Regola n. 2: lasciare dello spazio
differenza di altre piattaforme di telefono, il design Windows Phone dà piena applicazione edge-to-edge controllo sul layout design. Questo approccio consente al progettista di sentirsi al comando completo. Il cromo e condimenti tipici come il pulsante Indietro, chevron (>) su liste e linee di separazione elemento sono tutti elementi che riempiono lo schermo, senza migliorare l'usabilità complessiva.

Ecco perché la mancanza di questi elementi in Windows Phone non è una svista, invece, è uno sforzo per gli utenti condizione di aspettarsi che quasi ogni pezzo di informazioni in un elenco è perseguibile. Questo è vero per tutte le applicazioni di base che nave come parte del sistema operativo: per le impostazioni, Outlook o hub People, dovrebbe essere chiaro che viste di dettaglio sono disponibili per ogni elemento rappresentato.

Ci vuole un minimo di 24 pixel tra le voci di elenco per l'utente di differenziarli, così, non c'è bisogno di linee (vedi Figura 1). Ulteriori accorgimenti può essere fatto utilizzando diverse dimensioni dei caratteri o colori, ma niente di più di spazio aperto tra gli elementi è abbastanza potente.

[Clicca sull'immagine per ingrandirla.]

Figura 1. Questi elementi sono fortemente differenziate, anche se non ci sono linee di separazione tra gli elementi.

Regola n. 3: Margini Rispettare
Le applicazioni non sono statiche: l'evoluzione nel tempo. Sono nato a corto di idee su un tovagliolo o una conversazione che hai avuto con un amico. Poi passare attraverso le fasi di prototipazione, prototipi di design, prototipazione di sviluppo e, infine, un design formale.

In pochissimi casi questo significa che diverse persone stanno facendo il lavoro, soprattutto nelle piccole imprese. A volte sei il proprietario, sviluppatore, designer - anche il bidello - facendo tutto da soli.

A causa di questi fattori, la pressione e il desiderio irresistibile di spedire a volte si mette di mezzo per produrre quello che sarebbe stato una perfetta applicazione. Che cosa gli impedisce di essere perfetto? Spesso sono i dettagli apparentemente piccoli, ma possono rivelarsi non così piccolo nel competitivo mercato delle applicazioni mobili. Questo vale per il tema della nostra terza regola: Come roba di allineare correttamente.

Questa semplice regola - i margini di corretta - è per qualche motivo persi quando si cerca di ottenere controlli sullo schermo. Se c'era una sola cosa che potrebbe imprimere sviluppatori, sarebbe questa: un margine per tutti i contenuti funziona meglio, ne fanno 24 pixel da sinistra.

Regola n. 4: Get Controlli fuori della Via
controlli all'interno della casella degli strumenti Windows Phone sviluppatore vi permettono di creare infinite combinazioni di stili visivi e disegni artistici. La capacità di uno di questi strumenti, Silverlight, ai controlli stile fornisce un sacco di potenza. Ma questa flessibilità porta con sé alcune sfide potenziali.

Si consideri un esempio di utilizzo di un panorama o una pagina con un perno di controllo mappa. Questi due controlli nella pagina non rappresentano un problema. Tuttavia, quando si effettua il controllo all'interno del PanoramaItem Map, la mappa direttamente interferire con il gesto "swipe" Panorama del controllo, perché questo gesto è applicabile a entrambi i controlli. Questo può essere visto in Figura 2.

[Clicca sull'immagine per ingrandirla.]

Figura 2. Il risultato finale, quando due controlli interferire. Non è abbastanza. Problemi simili esistono con altri controlli, quando una vasta gamma di gesti è supportato. Come regola generale, non controlli nido che richiedono da lato a lato gesti. Linea di fondo: Rendere evidente per l'utente come utilizzare l'applicazione. Regola n. 5: Navigazione prevedibile Una domanda è una strada, la tua esperienza avanti e indietro attraverso la funzionalità è il percorso. Proprio come facciamo con i nostri punti di riferimento di navigazione nella nostra vita quotidiana, l'applicazione di navigazione è qualcosa che dovrebbe rimanere lo stesso. Il pulsante Windows Phone casa otterrà molti sviluppatori nei guai. Un pulsante Home all'interno di una applicazione è necessario sui telefoni che non dispongono di un pulsante dedicato Indietro; un iPhone è un buon esempio. Tutti i dispositivi Windows Phone hanno invece un pulsante hardware dedicato, eliminando la necessità di avere un tasto Home incorporato. Questo è un luogo dove la religione di progettazione è disponibile in: Perché iPhone, Android e Symbian tutte le applicazioni sono integrati i pulsanti Home, la convinzione è che un'applicazione Windows Phone ha bisogno di una, anche. A differenza di altre piattaforme, applicazioni Windows Phone mantenere uno stack pagina nel modello di navigazione.Questo modello si adatta l'aspettativa per un utente normale pulsante Indietro: torna alla vista precedente. In questo ambiente, un pulsante Home causerebbe un disegno imprevedibile di navigazione. Se l'utente naviga in profondità l'interfaccia e ad un certo punto casa presse, prosegue la navigazione in tutta l'applicazione, il numero di fotogrammi di navigazione continuerà a crescere, quindi il pulsante Indietro dovrà rilassarsi l'intero percorso. In un'applicazione Windows Phone senza pulsante Home, la navigazione è chiara e semplice: il pulsante Indietro restituirà sempre l'utente torna alla pagina precedente. In Windows Phone 7.1 SDK, una nuova API è stato aggiunto che permette agli sviluppatori di accedere e modificare lo stack pagina prima di tornare alla pagina precedente. Ciò ha dato una grande quantità di nuova flessibilità agli sviluppatori. Il cambiamento è stato fatto per sostenere una serie di non-lineare scenari di navigazione come carrelli e di pagamento e abbonamenti al servizio. Questi non-lineare scenari richiedono una procedura guidata da completare da parte dell'utente, ma il pulsante Indietro non lo stack di spostamento attraverso sette passi della procedura guidata di pagamento. In questo caso lo sviluppatore dovrebbe utilizzare la nuova API per modificare lo stack e tornare l'utente alla shopping experience, una volta una pagina di conferma è mostrato, per esempio. Anche se questa flessibilità l'API è ora disponibile, gli sviluppatori ancora devono garantire che l'esperienza complessiva di applicazione è altamente prevedibile. Ciò significa che l'utente deve sempre sapere cosa succede quando si fa clic sul pulsante Indietro. Regola 6: Imparare a Pin Tiles Una delle caratteristiche più abbracciata dagli sviluppatori è stato il supporto per le piastrelle più. La possibilità di pin tessere singole o multiple alla schermata iniziale è molto simile a un segnalibro in un libro. Quando appuntato, la tessera viene aggiunta alla schermata iniziale, e quando viene premuto, la tessera deve portare l'utente direttamente al contenuto o funzione. Ci sono stati numerosi dibattiti su come questa funzione dovrebbe essere usato. Dovrebbe essere un link ad un luogo specifico in un app, pur conservando la piena esperienza app? O dovrebbe limitare l'applicazione di un insieme ridotto di funzionalità, come un mini-app? Un certo numero di articoli sono stati scritti, ma questioni di l'intento originale continuano ad emergere sui forum e in vari eventi. Il concetto di una piastrella appuntato, mostrato in Figura 3, è stato come un segnalibro profonda che espone un sottoinsieme di funzionalità all'interno dell'applicazione. Per esempio, il tempo di una sola città, o una categoria di notizie, o una scheda sola, simile a quello fatto nella Hub Persona. [Clicca sull'immagine per ingrandirla.] Figura 3. Inchiodamento piastrelle. Detto in altro modo: una piastrella appuntato deve essere una scorciatoia per informazioni in genere si trova nel profondo l'applicazione - non è un segnalibro che continua a fornire l'accesso a tutta l'applicazione. Regola numero 7: Risultati limite relativo controllo mappa per cosa l'utente può vedere sulla Viewport Come Casella di testo e l'elenco, il Windows Phone SDK 7.1 comprende Mappa controllo. Questa è integrato con la mappatura Bing. Questo controllo versatile, supporta una serie di caratteristiche che consentono agli sviluppatori di creare esperienze di grande nativo mappatura Bing. Gli sviluppatori problema più comune imbattersi in cerca di mappa del mondo nel controllo. Mappa di Controllo ha buone prestazioni, ma non si può mai dimenticare che si sta eseguendo l'applicazione su un telefono. Ci sono alcune regole da ricordare quando si utilizza il controllo. In primo luogo, gli sviluppatori dovrebbero controllare se il punto è visibile nella zona della mappa, in altre parole, nel viewport. Un metodo banale per il controllo dovrebbe essere simile a questa: protetto bool CheckPinInViewport (doppia larghezza, doppia altezza, coordinate Point) { if (coords.X> 0 & & coords.Y> 0) { ritorno coords.Y <altezza e larghezza e coords.X <; } return false; } Non ha senso nel mostrare qualcosa al di fuori della finestra. L'esempio di codice si applica ai pin, ma il problema è più ampio, come il controllo Map supporta più tipi di elementi come le piastrelle, i livelli, forme e dei controlli. Ogni aggiunge complessità quando la visualizzazione della mappa viene spostato o riposizionato, aggiungendo calcoli che riguardano la CPU. La seconda questione è un po 'più complessa: cosa succede se un grande insieme di risultati viene restituito; condomini di Manhattan, per esempio? I risultati anche in una risoluzione della mappa relativamente basso grado di produrre un elevato numero di pin. In questo caso è necessario capire come i risultati raggruppare insieme, in un numero molto elevato di risultati, a parte pin sovrapposti sono di scarsa utilità per l'utente. Alla fine, ciò causa frustrazione e insoddisfazione. Una volta raggiunto un punto in cui la quantità di dati è più che sia l'utente sia in grado di gestire telefono, ci sono alcune opzioni da considerare. I dati possono essere filtrati, oi risultati dei perni adiacenti possono essere raggruppati. Ecco un esempio di clustering in un scenario reale. La vostra applicazione sta mostrando un elenco immobiliare, e ci sono 50 risultati allo stesso indirizzo (con numeri di unità diverse). Una visione tradizionale dei risultati avrebbe tutti i 50 pin impilati uno sopra l'altro. In una vista cluster, questi perni possono essere rappresentati da un singolo pin. Allo stesso modo, si può prendere un livello più alto e rappresentano un intero isolato o una sezione di blocchi da un singolo risultato, se la densità dei pin in quella posizione è più alto. La mappatura è generalmente un'esperienza coinvolgente; tutti si aspettano di essere entusiasmato dai vostri piedini modello personalizzato. L'input tocco dovrebbe attivare la spilla con sufficiente precisione per permettere all'utente di interagire con i dati senza essere frustrato. Regola n. 8: rimozione definitiva dovrebbe essere trasparente Questo è tutto su come l'applicazione risponde al segnale del telefono cellulare che ha bisogno di più memoria.Cominciamo con una descrizione del modo in cui il telefono alloca la memoria e gestisce lo stato dell'applicazione. Nel aggiornamento Mango del sistema operativo, le applicazioni non in vista non sono sfrattati dalla memoria: sono letteralmente in pausa e permesso di rimanere residente in memoria. Il resto della gestione della memoria segue la pre-Mango regole: applicazioni che richiedono memoria sono concessi la richiesta se è disponibile memoria sufficiente. Non succede nulla di fatto meno che l'applicazione attiva è esercitare più pressione sul pool di memoria attualmente disponibili. Se l'applicazione attiva ha bisogno di più memoria, il sistema operativo sfrattano l'applicazione in quelli meno utilizzati di recente (LRU) ordine. Come mostrato nella Figura 4, l'applicazione in primo piano - è il più lanciato di recente - potrebbero sfrattare la domanda non nella vista, basato sulla regola LRU. [Clicca sull'immagine per ingrandirla.] Figura 4. rimozione definitiva Come funziona in Windows Phone Mango. Nel processo di rimozione definitiva, Memory Manager OS segnali della domanda; che l'applicazione viene data una quantità finita di tempo di chiudere (è ucciso con forza se il tempo si esaurisce). Si noti che c'è una grande variabilità tra ciò che gli sviluppatori pensano dovrebbe accadere rispetto a ciò che effettivamente accade quando l'applicazione è riattivato. Gli utenti si aspettano che l'applicazione sia nello stesso stato in cui è stato lasciato. In particolare, vogliono sapere che un CheckBox è ancora spuntato, un TextBox contiene lo stesso testo, e un elenco è nella stessa posizione. Il modello di visualizzazione all'interno di Windows Phone aiuta con questa sfida, è possibile utilizzare un'associazione bidirezionale in Silverlight dal modello al fine di proprietà appropriate all'interno del modello durante la rimozione definitiva. Questo approccio risolve tutti i problemi tranne una: lista. Lista non possono essere gestiti nello stesso modo perché è un controllo complesso con una struttura profonda, ma contiene anche una serie di elementi a cui non è possibile associare direttamente. In questo caso, si sta cercando la posizione della proprietà VerticalOffset del ScrollViewer. Ecco come trovarlo: ScrollViewer visualizzatore = ((VisualTreeHelper.GetChild (myList, 0) come . FrameworkElement) FindName ("ScrollViewer") come ScrollViewer); _viewModel.ListBoxPosition = viewer.VerticalOffset; In questo caso, il codice salva il valore nella proprietà di base che possono poi essere salvati nella raccolta Stato della pagina. In sintesi: gli utenti non dovrebbero essere a conoscenza di qualsiasi cosa accade tra i rimozione definitiva delle app e quando si riprende. Regola n. 9: Gestire correttamente errori di rete Ci piace il costante stato collegato su desktop, ma non hanno questo lusso su dispositivi mobili. E in generale, la più mobile del dispositivo, il più imprevedibile lo stato della rete. Anche per un computer portatile, passando da una stanza all'altra può causare cambiamenti nel profilo delle prestazioni della rete. I telefoni cellulari sono peggio: sono dispositivi altamente sensibili, e la quantità di potenza applicata all'antenna deve essere bilanciata con le prestazioni della batteria. Gli utenti finali ben pochi avrebbero godere di un telefono cellulare che dispone di reception fantastico, ma dura solo 30 minuti. L'inverso è vero anche: prestazioni di rete molto poveri non fa felici gli utenti, anche se la batteria dura una settimana. Queste situazioni richiedono che gli sviluppatori di testare scenari aggiuntivi. Qui ci sono alcuni problemi relativi alla rete che influiscono sulla qualità complessiva di un'applicazione: 1. Stato disconnesso l'app. Se l'applicazione richiede l'accesso ai dati attraverso la rete, cosa succede quando la rete non è disponibile? In questo caso, tutte le chiamate di rete un'eccezione. Anche se può sembrare banale, questo è spesso mancato, basta mostrare un messaggio di errore non è utile alla maggior parte degli utenti. Ci sono alcuni modi l'applicazione può mettere in guardia su un problema di rete, compresi gli indicatori verde o rosso-luce, oscuramento l'intera interfaccia utente o qualcosa di semplice come un messaggio utile. Nel corso del tempo, gli sviluppatori hanno imparato modi per verificare la connettività. listato 1 , mostra un metodo di esempio. Ecco la versione XAML: <Griglia di sfondo = "# CC000000" Margine = "0,0,0, -32" Grid.RowSpan = "2" DataContext = "{origine di associazione = {StaticResource Locator}}" Visibilità = "{Binding Environment.IsNetworkAvailable, Mode = OneWay}"> <TextBlock HorizontalAlignment TextWrapping = "Center" = Testo "Wrap" = "Non Collegato ... "VerticalAlignment =" center "/> </ Grid> Questo codice, che potrebbe essere adattato molto rapidamente per soddisfare quasi tutte le situazioni, consente all'utente di sapere in modo proattivo che la connessione di rete si è interrotta. Il blocco di codice precedente fornisce un modo per determinare e gestire lo stato della rete. Ma c'è ancora un elemento di connessione di rete lasciato irrisolto: deleghe. Proxy causare un comportamento interessante per il metodo NetworkInterface.GetIsNetworkAvailable. La chiamata al metodo restituisce true - in effetti, è vero - quando il telefono è collegato alla rete e ha un indirizzo IP. Tuttavia, poiché il proxy non è ancora stato autenticato, tutte le chiamate ai servizi saranno bloccati. Metodi che effettuano chiamate di rete dovrebbe usare una qualche variante del seguente: / / Utilizzare la proprietà "ResponseUri" per ottenere il Uri reale da dove il / / Risposta è stata raggiunta per assicurarsi che non è il parlare proxy. if (httpResponse.ResponseUri.AbsoluteUri.ToString () == URLrichiesta) { / / Il contenuto è stato restituito dal server desiderato, fare un lavoro ... } Infine, proviamo ad esaminare la gestione delle richieste terminato a causa di rimozione definitiva. Si tratta di un problema critico, soprattutto per applicazioni che richiedono lunga le richieste del server. E 'una considerazione importante che deve essere gestita bene, ma non è facile da replicare, in particolare nell'emulatore. Ci sono utility che permettono di simulare le condizioni della rete, tra cui 4G fino in fondo anche a super-bassa larghezza di banda collegamenti dove byte singolo passare attraverso. Wireshark è uno strumento piacevole da usare per la limitazione della larghezza di banda della rete. Come la richiesta viene completata dopo la chiamata al metodo WebRequest.BeginRequestAsync, callback viene richiamato. Ricordate anche che le misure di recupero adeguati dovrebbero essere sviluppate nel caso in cui la risposta non è stata completata. Non rappresentano una richiesta di brutto potrebbe causare il codice a fallire, portando ad un crash dell'applicazione. La lezione qui: Non sottovalutare quanto severamente una cattiva connessione può degradare la qualità app. Regola n. 10: Evitare il thread dell'interfaccia utente blocco Uno dei temi più impattanti legate alla user experience è bloccare il thread dell'interfaccia utente. Non c'è niente di più doloroso per l'utente di un'applicazione che non è fluido. Un buon 15 anni fa, quando Visual Basic era in pieno svolgimento, un'applicazione a volte lo "sbiancamento" come una chiamata al database potrebbe bloccare il thread dell'interfaccia utente. Ma il modello a thread singolo appartamento in Visual Basic assicurato che non c'era molto che potesse essere fatto al riguardo - la maggior parte degli utenti appena finito di attesa per l'applicazione di fare il suo lavoro e ritorno. Da allora abbiamo passati a modelli migliori threading, ma se gli sviluppatori non si sta attenti, le applicazioni possono ancora ci ricordano di quel passato, con schermi bloccato e interfacce utente nervosi. Listato 2mostra un esempio lampante. Questo appare come un esempio estremo, ma questo codice potrebbe accadere in ogni caso l'interfaccia utente, Button.Click, List.SelectionChanged o di qualsiasi costruttore. Per risolvere questo problema, abbiamo bisogno di caricare dati dal thread dell'interfaccia utente. Per fare questo, modificare l'evento Loaded, come mostrato nel Listato 3 . Come per qualsiasi modifica del codice, questo approccio introduce un altro piccolo espediente: i dati una volta che è ricevuto, il contesto filettatura non è più sul thread UI, tagliare l'accesso a tutti gli elementi per inserire nuovamente i dati nel modello. Per farlo correttamente, è necessario spedire il contesto al thread dell'interfaccia utente utilizzando Dispatcher.BeginInvoke. Nota ci dovrebbe essere il codice meno possibile - non in termini di numero di linee, ma nella lunghezza del tempo necessario per eseguire: vuoto getDataWorker_RunWorkerCompleted (object sender, RunWorkerCompletedEventArgs e) { this.Dispatcher.BeginInvoke (() => { / / Prendi le modifiche dal modello per l'interfaccia utente di qui ... }); } Uno strumento che non ha discusso in questa sezione, che merita un proprio articolo, è il nuovo Windows Phone 7.1 SDK Profiler prestazioni. Si tratta di uno strumento prezioso che ogni squadra dovrebbe adottare. Esso individua e suggerisce le soluzioni per i thread UI bloccati, le perdite di memoria e CPU problemi legati, tra gli altri. La cosa più importante da ricordare quando si usa il Profiler: Stabilire un riferimento per le prestazioni e confrontarlo spesso vengono apportate modifiche durante lo sviluppo. Questo farà sì è possibile individuare quale particolare codice delta causato un problema, permettendo al team di valutare e rimediare. Come regola generale, qualsiasi azione che richiede più di 50-100 millesimi di secondo non deve essere fatto sul thread UI. Non lasciate che Scadenze Causa Scorciatoie Squadre di fronte scadenze nel mondo in continua evoluzione di sviluppo mobile sono sempre sotto pressione per la spedizione dei prodotti. Ma la scelta che il percorso è pieno di pericoli, e deve essere evitato. Dopo tutto, è importante per i business manager a capire che la costruzione di una reputazione e guadagnando quote di mercato richiede tempo, mentre è sempre più indietro dopo un gran numero di una stella recensioni sarà molto più difficile. Questo significa fare un esame obiettivo del codice e vedere cosa funziona già, allora che cosa ha bisogno di più amore dal team di sviluppo.I 10 articoli elencati qui vi velocità lungo la pista di un solido, ben accolto applicazione Windows Phone che dovrebbe evitare i negativi che vengono con un prodotto rilasciato prima che sia pronto. Corso Visual Studio - Corsi Visual Studio Corso .Net- Corso Dot.Net - Corso Vb.net Corso C# - Corso PHP - Corso Joomla

. NET Rocks sicurezza colloqui con Carl, Richard e Troy

Nel caso in cui abbiate vissuto sotto una roccia (no pun intended), negli ultimi nove anni e mezzo,. Rocks NET è senza dubbio la più importante. Podcast NET a tema l'universo. Nel momento in cui ha ottenuto me, c'erano già stati 734 episodi precedenti (spesso in esecuzione per un'ora o più), per cui la serie ha veramente bene e diventare radicata nella psiche di molti. Sviluppatore NET. Quanti sviluppatori? A quanto pare circa 250.000 , sì un quarto-di-un-milione-.NET-sviluppatori. Wow!

Per me, negli ultimi anni è stato uno dei podcast molto, molto pochi dove sarò religiosamente ascolta ogni episodio, indipendentemente dal contenuto. Carl e Richard sono diventati una parte della mia unità giornaliere, voli a lungo e regimi di esercizio su base piuttosto regolare.

Il mio discorso è arrivato in un buon momento per la protezione delle applicazioni (a seconda della prospettiva). Avevamo appena coronato un anno di sito web senza precedenti hacking e proprio quando abbiamo pensato che fosse tutto finito, arrivò Stratfor e poi la situazione hash DoS . Durante questo periodo ho anche avvolto la OWASP Top 10 per. serie NET sviluppatori , confezionato il tutto in un eBook bel po ' e ha lanciato ASafaWeb .

Nello spettacolo si parla di ciascuno dei OWASP Top 10 rischi di sicurezza di applicazioni web e su come mitigare in. NET plus testa su un paio di tangenti su alcuni recenti hack, la gestione delle password e l'importantissima pronuncia di "ASafaWeb" e " OWASP ". Ho avuto una palla di registrazione dello show (nonostante la mia mancanza di internet e di dover ricorrere a Skype su iPhone su reti 3G), e ogni impressione ho avuto di Carl e Richard è stata rafforzata sia dentro che fuori l'aria. Grandi ragazzi che amano la loro tecnologia e la passione per la condivisione con tutti coloro che ci ascoltano.

Così qui è, buon divertimento!

Corso Visual Studio - Corsi Visual Studio
Corso .Net- Corso Dot.Net - Corso Vb.net
Corso C# - Corso PHP - Corso Joomla

CAPTCHA rottura con gli esseri umani automatizzati

Siamo tutti familiarità con diritto CAPTCHA? Quella fortezza impenetrabile di personaggi folli ondulata che solo un essere umano reale può decifrare. Mentre tendono a guidare noi un po 'noci, che fanno in realtà forniscono una preziosa funzione in quanto impediscono l'automazione delle richieste nei confronti dei servizi on-line. Per esempio, non è possibile da soli ottenere un account Google senza prima avvolgendo la testa attorno a ciò che sulla terra, questo si dice:

Perché Google fa? Bene, una volta che ti sei creato un account Google ora avete GMail e G + e ogni sorta di altre piattaforme che potrebbero essere utilizzate per eseguire tali nefaste attività la generazione di spam, distribuzione di malware o la creazione di false identità. Una volta che è possibile automatizzare questo, queste attività possono essere eseguite in massa.

Si tratta di un accordo simile con Western Union :

E 'facile immaginare che essere in grado di creare automaticamente gli account presso un istituto finanziario potrebbe aprire la porta ad ogni sorta di imbrogli monetaria. E se siete già stati in grado di creare un account GMail, hai tutto il necessario per iniziare a dosaggio la creazione di identità alla Western Union.

Così CAPTCHA impedisce tutto questo, giusto? Solo gli esseri umani possono violare il codice e completare i processi di iscrizione, giusto? Ma cosa succederebbe se potessimo automatizzare gli esseri umani, voglio dire che se potessimo prendere CAPTCHA e risolverli a un ritmo tale che questi processi di registrazione potrebbe essere facilmente automatizzato?Ebbene si scopre che può e che vi costerà solo un paio di dollari.

CAPTCHA commodity risolvere con Antigate

L'ispirazione per questo post risale a un pezzo che ho letto recentemente dal famoso scrittore di sicurezza Brian Krebs sul Sweatshops virtuale Sconfiggere Bot-o-Non Test .Nell'articolo, Brian parla di come risolvere i CAPTCHA viene esternalizzata dagli spammer per servizi in mercati a basso costo che utilizzano le persone reali a sfornare attraverso un gran numero di il testo offuscato per una frazione di centesimo di volta in volta, si parla fino a $ 1 per 1.000 CAPTCHA. Proprio così, un decimo di un centesimo per risolvere un CAPTCHA. Il servizio è di consumo tramite un API che significa concettualmente script automatici degli spammer 'può semplicemente passare il CAPTCHA off e ottenere una risposta rapida che contiene il testo vero e proprio, che possono poi essere utilizzati nei loro sforzi di spamming.

L'articolo parla KolotiBablo.com che si rivolge a coloro che desiderano unirsi al team di elite cracker CAPTCHA. Sono una squadra impressionante guardare troppo:

Personalmente, se fossi uno spammer, sarei confortato dal sapere che i miei cracker CAPTCHA sono stati ornati in giacca e cravatta e alla supervisione di un supervisore attraente in un abito pantaloni. Ma sto divagando.

Ho pensato che sarebbe interessante prendere in realtà di questo servizio e vedere quanto efficiente in outsourcing fessurazione CAPTCHA può essere. Mentre KolotiBablo.com potrebbe essere la coalface per sarebbero cracker CAPTCHA, se vogliamo utilizzare il servizio fessurazione abbiamo bisogno di firmare con Antigate oltre a antigate.com (entrambi scappare stessa sottorete):

Antigate offre una struttura di prezzo molto attraente con posible pagamento in un numero di differenti formati più diffusi. Tuttavia, è importante notare che il servizio non può essere utilizzato per operazioni di spam perché lo generano "butthurt". Non ero del tutto sicuro di cosa questo significasse, ma dopo che usare Google ho deciso che probabilmente era meglio non partecipare alla butthurting e sarebbe più sicuro solo di costruire la mia app piccolo test, invece.

La registrazione è molto simile la registrazione per ogni vecchio servizio:

In effetti è così tanto come molti servizi di registrazione comune che non c'è SSL. E non come password complesse. E mi manda indietro la mia bella stringa generata 1Password folle di personaggi:

Password attenuato un po ', tutto sembra essere ok, penso:

Una volta effettuato l'accesso, tutto sembra piuttosto semplice con una bella opzioni di avvio rapido. Quello che volevo veramente fare era scrivere il mio codice, che è fortunatamente una delle opzioni:

Wow, hanno anche avuto un mercato! Magari un'altra volta, per ora voglio solo cominciare a risolvere CAPTCHA. Guardando l'API, il processo va in fondo così:

1. Invia la chiave di CAPTCHA e API tramite una richiesta HTTP POST
2. Una risposta viene restituito con un ID
3. Attendere 10 secondi, quindi inviare il ID di nuovo in un'altra richiesta
4. Una risposta sia con il testo risolto o lo stato "non pronto" viene rinviato
5. Se non è pronto, attendere 5 secondi per poi chiedere lo stato di nuovo (risciacquo, schiuma, ripetere)

Sembra un caso d'uso molto buono per polling lungo . Non importa, l'API è semplice, la cosa interessante sarà il tasso di successo conseguito.

Prima di passare al punto cruciale di questo post - in realtà "rottura" CAPTCHA - c'è un altro utile servizio fornito da Antigate e questa è la possibilità di ottenere un rapido controllo sanitario sullo stato degli operatori. In realtà, è possibile caricare da soli , senza l'autenticazione e si dovrebbe vedere qualcosa di simile a questa:

Ha senso molto di più quando si vede l'XML sottostante la fonte:

< RISPOSTA >
  < attesa > 50 </ attesa >
  < Carico > 86,53 </ carico >
  < minbid > 0,001 </ minbid >
  < averageRecognitionTime > 16,175225206526 </ averageRecognitionTime >
</ RISPOSTA >

Questo rende molto conveniente per capire quando per caricare il servizio con le richieste per risolvere CAPTCHA. Ne riparleremo più avanti.

Costruire un sito CAPTCHA permesso di rompere

Naturalmente niente di tutto questo sta andando essere molto interessante se non abbiamo un sito CAPTCHA abilitati ad iniziare rottura. Per evitare il butthurting, ho creato un sito web ASP.NET MCV 3 e afferrò il Web Helper Biblioteca da Microsoft. Gli helper web rendono molto semplice far cadere un CAPTCHA in qualsiasi pagina e quindi convalidare l'invio.

In realtà, è un reCAPTCHA implementazione e la distinzione è importante, acquisito da Google qualche anno fa, reCAPTCHA è progettato per contribuire alla digitalizzazione dei libri di testo in modo da questo esercizio è di andare a rendere il mondo un posto un po 'meglio con si spera che ulteriori informazioni disponibili a più persone. In più c'è il fatto che Google serve circa 200 milioni di essi ogni giorno quindi è un bene di alto profilo dell'attuazione e riflessivo di quanto servizio Antigate è probabilmente usati per risolvere già.

Passando, ho costruito una forma tipica di registro come segue:

Ciò che è veramente importante qui è come il CAPTCHA rende in HTML, abbiamo bisogno di capire questo al fine di scaricare in realtà l'immagine di Google, inviarlo a Antigate poi presentare i valori di forma corretta con la registrazione. Tenete a mente che tutto ciò che stiamo per vedere è facilmente disponibile nel codice HTML di un sito attuazione CAPTCHA.

Prendendo il modulo di registrazione dall'alto, il CAPTCHA è incorporata tramite il seguente markup:

< script di tipo = "text / javascript">
   va r R ecaptchaOptions = {"t eme ": "R ed ", "l ang ": "e n ", "t abindex ": 0};
 </ script di >
<script src="http://www.google.com/recaptcha/api/challenge?
  k=6Le2hMwSAAAAAPhhj00SFHjaniz3zLnV0nDLThq9"
  type="text/javascript"></script>
< noscript >
  <iframe frameborder="0" height="300px" 
    src="http://www.google.com/recaptcha/api/noscript?
    k=6Le2hMwSAAAAAPhhj00SFHjaniz3zLnV0nDLThq9" width="500px"></iframe>
  < br />
  < br />
  < textarea cols = "40" name = "recaptcha_challenge_field" file = "3"> </ textarea >
  < Ingresso nome = "recaptcha_response_field" tipo = "hidden" 
    value = "manual_challenge" />
</ noscript >

Il modo più semplice per guardare a questo è quello di concentrarsi sul contenuto nel tag <noscript> che è quello che sta per essere analizzato se il browser non supporta JavaScript (o ha spento). Questo ci salva da trattare con tutta la logica del file di script esterni che altrimenti usati per inserire l'immagine CAPTCHA nella maggior parte dei browser.

Il bit importante è la fonte iframe che è dove l'immagine verrà incorporato. In questo caso, è possibile vedere il percorso è http://www.google.com/recaptcha/api/noscript?k=6Le2hMwSAAAAAPhhj00SFHjaniz3zLnV0nDLThq9

Questa pagina ti rendono una implementazione di base CAPTCHA - ricordate che questo è quello previsto per la gente senza JavaScript:

L'immagine CAPTCHA è diverso da quello precedente in forma, come abbiamo caricato l'iframe due volte che l'ha causato per aggiornare, una volta quando abbiamo caricato la pagina di registrazione che poi di nuovo quando ho caricato l'iframe separatamente per catturare lo schermo di cui sopra. Quando ho automatizzare questo nella prossima sezione che viene caricato solo una volta.

Ispezionare il sorgente della pagina iframe, possiamo facilmente trovare l'immagine CAPTCHA incorporato nel codice:

<img width="300" height="57" alt="" src="image?
c=03AHJ_VusH0z9XlyEjm8c2Qm6sl9DhDD_fWq7R-tpRlwhF0KeLy2m8nZBM-
T7AOpGn6UCLd0M7fITJZ2RJ0pgHVt2PrchJwp3VoaKwcJMAK7_BhQdxIPidUT5-
nAUIF7GRDD3vrjs2CXLfw7byQMJa9gDNy9CSvhiSuw">

E naturalmente siamo in grado di estrarre l'URL reale dell'immagine stessa. Questo è il punto di esercizio come questo è il ragazzo che dobbiamo mandare a Antigate:

http://www.google.com/recaptcha/api/image?c=03AHJ_VusH0z9XlyEjm8c2Qm6sl9DhDD_fWq7R-tpRlwhF0KeLy2m8nZBM-T7AOpGn6UCLd0M7fITJZ2RJ0pgHVt2PrchJwp3VoaKwcJMAK7_BhQdxIPidUT5-nAUIF7GRDD3vrjs2CXLfw7byQMJa9gDNy9CSvhiSuw

L'ultima cosa che dobbiamo sapere è come costruire l'invio del form al sito di destinazione.Ovviamente questo include valori quali il nome e l'indirizzo con il CAPTCHA risolto, ma c'è un po 'più ad esso che quello. Diamo un'occhiata a ciò che viene presentato dal guardare la richiesta HTTP con Fiddler :

Quello che vediamo qui è un gruppo di campi in cui ho appena inserito "aaa" e poi due campi CAPTCHA correlati: una sfida e una risposta. La sfida è semplicemente il parametro di stringa di query da l'immagine CAPTCHA sopra e la risposta è ovviamente il CAPTCHA risolto. Ora sappiamo tutto quello che serve per costruire il cracker CAPTCHA.

Costruire il cracker CAPTCHA

Antigate cercare di essere utile qui e fornire un piccolo esempio di C # per iniziare. Ho finito per riscrivere lo stesso sia per brevità e per garantire ho capito esattamente che cosa stava succedendo. In più, naturalmente, ha bisogno in realtà di automatizzare l'invio del form nella nostra applicazione CAPTCHA abilitato che è naturalmente un requisito su misura.

Ho finito con una console app che fa questo:

In breve:

1. Richiedere la pagina di registrazione dal sito di destinazione
2. Richiedi la fonte iframe usati per inserire l'immagine CAPTCHA
3. Richiedi l'immagine CAPTCHA utilizzati nel sito e salvarlo in locale
4. Invia il CAPTCHA al servizio Antigate
5. Antigate assegna il CAPTCHA di un operatore umano che risolve allora e lo rimanda indietro a loro
6. Attendere 10 secondi, poi controllare con Antigate per il testo CAPTCHA (ripetere ogni 5 secondi, fino a risolvere)
7. Invia una registrazione al sito di destinazione con i campi compilati (che ho appena definito un set statico di dati di esempio) più la sfida CAPTCHA e testo risolto

Dopo tutto questo è completo, ho anche aggiunto qualche registrazione perché voglio monitorare le cose come velocità e tasso di successo più la durata di ogni fase del processo.Il successo del processo è determinato dalla risposta del modulo di presentazione, ovviamente se si ottiene il diritto CAPTCHA stai per ricevere un corpo di risposta molto diverso se si sbaglia.

Questo è tutto - è davvero così semplice. Ma questo non è un servizio gratuito così avremo bisogno di un po di credito prima di procedere.

Rabbocco del conto Antigate

L'ultima cosa che dobbiamo fare prima la rottura grave CAPTCHA inizia è quello di mettere dei soldi sul conto Antigate. Fanno le cose piuttosto facili, delegando i bit finanziari off diAvangate che vendono codici di ricarica per i diversi valori:

Avangate è una bella fama e-rivenditore di prodotti software che di solito significa che si sta acquistando numeri di licenza. Nel corso sul loro sito, la (attualmente) dollaro australiano forte significa che stiamo cercando a 96 centesimi per rompere 1.000 CAPTCHA. Nizza:

Il pagamento avviene tramite PayPal e sono andato eseguire la stessa procedura di autorizzazione dopo che sono stato rimandato Avangate:

Poco dopo e il codice è comodamente tramite e-mail:

E ... siamo attivo e funzionante:

A destra, ora davvero interessante po comincia.

Rottura CAPTCHA

Diciamo la rincorsa! Ho aggiunto un po 'di verbosità di uscita che è stata molto utile durante il processo di compilazione:

Qui possiamo vedere il percorso di origine iframe seguita dal percorso immagine CAPTCHA e poi la stringa di query estratte da esso (si ricordi, questa è la sfida che dobbiamo presentare con la forma). L'immagine viene quindi salvata in locale, sottoposti a Antigate e una risposta con l'ID restituito, che in questo caso è 42244161. Si può vedere il processo poi dorme per 10 secondi, seguita da un totale di tre richieste, ogni cinque secondi di distanza, fino a quando una risposta viene restituito con il testo "mungo odatesp". Questo è il primo momento "Wow!"; Un essere umano da qualche parte ha effettivamente risolto questo e lo ha inviato di nuovo a me!

Ma naturalmente la vera prova del successo è ancora una volta il modulo viene inviato. La seconda riga di testo ultima mostra questo è tornato su "Ok" in modo che il modulo ha effettivamente restituito un corpo di risposta coerente con una registrazione. Infine, l'intero processo ha preso poco più di 27 secondi e il cracker CAPTCHA anche registrato con successo il processo:

In questo caso qui, perché ho anche controllare il sito web abbiamo presentato l'iscrizione alla posso fare un test di integrità e assicurarsi che la registrazione è stata effettivamente presentata:

Sì, guarda a destra! Questo ha tutti i dati di esempio ho configurato il cracker CAPTCHA di inviare e CreateDate sul record cade subito dopo la CaptchaCompleteDate nel registro. Così là lo avete - successo elusione programmatica CAPTCHA utilizzando un essere umano automatizzato. Il problema è che, 27 secondi non è esattamente vesciche. Ma c'è un modo migliore per guadagnarsi da prestazioni ed è qualcosa che i programmatori hanno conosciuto per molto tempo: il multithreading.

Utilizzando il modello multithread esseri umani

Che cosa succede se cominciamo multithreading gli umani? Voglio dire piuttosto che correre su una singola istanza del cracker CAPTCHA, che ne dite, per esempio, 30 casi in contemporanea? Naturalmente il successo di questo modello dipende dalla disponibilità di 30 operatori che sono in grado di lavorare contemporaneamente su ciò che è in sostanza un processo sequenziale (un operatore non può risolvere uno CAPTCHA alla volta). Ma, come abbiamo visto in precedenza, non è raro avere 50 operatori a portata di mano.

Così ho realizzato un "multithreading dei poveri" e sparò il 30 istanze separate della console cracker di CAPTCHA:

Ho lasciato questa corsa per 20 minuti poi analizzato i risultati che, come ci si aspetterebbe, mostrano una velocità molto più alta:

Un totale di 1.230 CAPTCHA sono stati mandati a Antigate e solo 77 non sono stati risolti correttamente quindi causando il processo di registrazione a fallire. Questo è un tasso di successo del 94%:

Ma anche se multithread, il processo di soluzione dei CAPTCHA era ancora un enorme collo di bottiglia in automazione iscrizioni:

Infatti i numeri si ruppe a 420ms dall'inizio alla quale l'immagine CAPTCHA era pronto per l'invio fuori poi 26 secondi per ottenere effettivamente una risposta indietro con il CAPTCHA risolti seguito da 199ms di sottoporlo al modulo di registrazione con gli altri campi.Chiaramente CAPTCHA mette ancora una intaccare in maniera significativa la durata complessiva del processo, che è quasi il 98% del processo di totale sottomissione è masticare lassù.

Ma naturalmente è possibile eseguire le discussioni pressoché illimitata (a seconda delle persone a disposizione) e la linea di fondo è che sono stato in grado di rompere il processo di CAPTCHA e di automatizzare le registrazioni al ritmo di uno per ogni 0,98 secondi e con un tasso di successo del 94% . Questo ha veramente bene e ha dimostrato che l'intento di CAPTCHA può infatti essere sconfitto semplicemente automatizzando l'uomo.

Riassunto

Devo ammettere, mi sento un po 'dispiaciuto per la gente seduta lì all'infinito la soluzione di un flusso senza fine di CAPTCHA, francamente, un solo drive me un po' i dadi! Ma quello che doveva essere ancora peggio - e ho bisogno di prendere qualche colpa qui - è che durante il test ho continuato a sottoporre il CAPTCHA stesso più e più e più volte. Posso immaginare il povero operatore seduto lì a pensare "WTF è questo tizio già facendo?" Poi di nuovo, forse hanno fatto qualche soldo veloce perché riconoscendo al tempo stesso modello e diventa ancora più efficiente.

Quando ho ricevuto lo script in esecuzione, non potevo fare a meno di accenderlo più e più volte. Francamente, ho trovato un po 'mindboggling pensare che ogni volta che ho eseguito, che dolorosamente ottuso CAPTCHA poco volava di tutto il mondo e di essere risolto da qualcuno per cui 0,001 dollari è stato uno sforzo utile e il risultato efficiente consegnato torna da me nel giro di pochi di secondi. C'è qualcosa di bello l'efficienza con cui questo accade.

Naturalmente l'altra questione solleva tutto questo è la legalità di un servizio come Antigate.Da un lato, sono solo la conversione di bitmap a caso al testo, che in sé e per sé, è probabilmente un grosso problema. Ma può anche essere un grosso problema nello stesso modo che Napster e Megaupload ha permesso di condividere file, ma potrebbe scendere al implicita (o presunte) intenzioni del servizio. Alla fine della giornata, antigate.com si attesti ad un IP in Florida così assumedly se uscissero fallo abbastanza di legge, l'azione che abbiamo visto con Megaupload scorsa settimana non sarebbe troppo difficile, voglio dire, non è a loro piace ' re secreto via in più buio più profondo dell'Europa dell'Est o nulla.

L'altra cosa da notare è che Antigate non sono solo i ragazzi là fuori che forniscono questo servizio; Death By CAPTCHA offre un servizio molto simile così come bypass CAPTCHA eCAPTCHA beat , questo non è esattamente territorio innovativa. Poi la disponibilità di tutti questi servizi potrebbe rendere molto facile stare in piedi un "cluster umani" modello in cui si ripete il processo che ho passato sopra simultaneamente attraverso molteplici servizi di conseguenza aumentando notevolmente la velocità.

Ora, naturalmente, niente di tutto questo è in realtà rompendo l'attuazione CAPTCHA, la santità della parola deformata è stata mantenuta e anzi ha preso reale gli esseri umani vivono per la loro risoluzione in testo normale. Ma ciò che questo esercizio si dimostrano è che l'affermazione che CAPTCHA impedisce l'automazione è semplicemente sbagliato, tutto quello che serve è per una parte della automazione per essere spostato da computer per l'uomo. Considerate questo contro la definizione di Wikipedia e sarebbe giusto dire che questo esercizio ha minato la premessa stessa sicurezza su cui è costruito CAPTACH:

La base del sistema di CAPTCHA è quello di impedire l'accesso automatico a un sistema da programmi informatici o "bot"

E 'una posizione strana per avvolgere il post su, voglio dire che siamo talmente abituati a mettere le nostre emozioni, i PC ad alta efficienza al lavoro per salvare noi umani dal lavoro esercizi intensivi. Ma ciò che questo post ci mostra è che a volte abbiamo bisogno di invertire il processo e invece automatizzare l' uomo nella misura in cui possono effettuare ad alti livelli di efficienza. Ci vuole solo alcuni orchestrazione intelligente e abbastanza che gli esseri umani sono disposti a fare il lavoro a buon mercato sufficiente a rendere l'esercizio economicamente conveniente.

Corso Visual Studio - Corsi Visual Studio
Corso .Net- Corso Dot.Net - Corso Vb.net
Corso C# - Corso PHP - Corso Joomla