2015-10-14 12 views
14

Sul nostro server di produzione, ho pubblicato javascript miniato e non includo un file di mappa con esso, perché non voglio che l'utente sia in grado di capire cosa sta accadendo in base all'errore.Come posso prendere una traccia dello stack javascript minata ed eseguirla contro una mappa sorgente per ottenere l'errore corretto?

Ho un servizio di registrazione che ho scritto per inoltrare le eccezioni angolari (catturate da $ exceptionHandler) a me stesso via e-mail. Tuttavia, questa traccia dello stack è vicina illeggibile:

n is not defined 
    at o (http://localhost:9000/build/app.min.js:1:3284) 
    at new NameController (http://localhost:9000/build/app.min.js:1:3412) 
    at e (http://localhost:9000/build/bower.min.js:44:193) 
    at Object.g.instantiate (http://localhost:9000/build/bower.min.js:44:310) 
    at b.$get (http://localhost:9000/build/bower.min.js:85:313) 
    at d.compile (http://localhost:9000/build/bower.min.js:321:23333) 
    at aa (http://localhost:9000/build/bower.min.js:78:90) 
    at K (http://localhost:9000/build/bower.min.js:67:39) 
    at g (http://localhost:9000/build/bower.min.js:59:410) 
    at http://localhost:9000/build/bower.min.js:58:480 <ui-view class="ng-scope"> 

Quello che mi chiedo è: Esiste un programma dove posso analizzare questo stack trace contro il codice sorgente non minified reale tramite file mappa (o non tramite mappa file se c'è un altro modo)

+0

Sono in grado di trovare alcuni strumenti adeguati per questo problema: - http://www.stacktracejs.com/ - http://sourcemaps.info/ (su GitHub: https://github.com/bugsnag/sourcemaps .info) Questo può convertire la traccia dello stack minificata nella traccia dello stack di sviluppo. –

+0

sourcemaps.info fa esattamente quello che l'OP chiedeva e ciò di cui avevo bisogno. Grazie! Un suggerimento perché all'inizio ero stato buttato fuori: non hai bisogno di mappe sorgente rivolte al pubblico. Dopo aver incollato nella traccia dello stack se non riesce a trovarli, ti dà una casella per incollare manualmente la mappa del sourc. Non un ottimo UX, e consuma costantemente CPU, ma la funzionalità è azzeccata :). –

+0

hai trovato una soluzione per questo problema? –

risposta

-1

Aggiunge direttiva commenti per il JS in esecuzione nella pagina.

// # sourceMappingURL =/path/to/la vostra/sourcemap.map

in Firefox (non è sicuro su Chrome) per dire al debugger per utilizzare le mappe di origine se sono disponibili, cliccare su "Impostazioni Debugger" pulsante e selezionare "Mostra origini originali" dall'elenco delle impostazioni che si apre:

+1

Va bene se voglio che le mappe di origine funzionino durante l'esecuzione dell'applicazione, ma non voglio che l'utente abbia la mappa sorgente . Voglio solo essere in grado di analizzare la traccia dello stack –

1

Se si ha accesso esternamente al file della mappa di origine e si può ottenere la stessa struttura di file, è possibile risolverlo, credo, ma sono non è a conoscenza di strumenti esterni al browser che possano aiutarti.

L'ulteriore vantaggio di avere i dati in un browser in esecuzione consentirà il controllo dei locali che non otterrete nemmeno con una mappa sorgente.

È possibile prendere in considerazione uno strumento come rollbar per eseguire la segnalazione degli errori. Questo riporterà tutti i locali in ogni fotogramma per facilitare il debug. Ha il supporto per sourcemaps outside the browser per risolvere i problemi di sicurezza.

+0

Grazie per il suggerimento! Sarebbe piuttosto utile, ma la nostra compagnia probabilmente richiederebbe la licenza aziendale dal rollbar, e dubito che potrei convincere il mio capo a spendere $ 1000 al mese per quello. È sicuramente una soluzione anche se –

+0

Questo è sicuramente molto da pagare solo per controllare dove si sta verificando questo errore! – Euan

+1

Sì, esattamente. E questo errore specifico è uno che ho intenzionalmente causato per dimostrare un punto. La nostra app è a pochi mesi dalla produzione, ma sto cercando di individuare una buona soluzione di errorHandling all'inizio del processo. –

9

Quello che vuoi fare è analizzare le mappe sorgente. Questo non ha nulla a che fare con i browser web. Tutto quello che devi fare è tradurre il riferimento miniato nella risorsa non ancora terminata.

Se hai esperienza con NodeJS, esiste già un pacchetto che fa questo per te.

https://github.com/mozilla/source-map/

Per installare la libreria

npm install -g source-map 

Creare un file denominato "issue.js"

fs = require('fs'); 
var sourceMap = require('source-map'); 
var smc = new sourceMap.sourceMapConsumer(fs.readFileSync("./app.min.js.map","utf8")); 
console.log(smc.originalPositionFor({line: 1, column: 3284})); 

Eseguire il file con il nodo

node issue.js 

E ' dovrebbe inviare la posizione nel file originale alla console per la prima riga dalla traccia dello stack.

Nota: ti dico di installare globalmente la mappa di origine per facilità d'uso, ma potresti creare un progetto di nodo che fa ciò che ti serve e lo installa localmente.

+0

Questa è una grande idea. Spero che ci sia qualcosa che posso usare per analizzare un'intera traccia dello stack, ma suppongo che potrei scrivere qualcosa per leggere lo stack trace riga per riga per fare la stessa idea. Grazie per il suggerimento! –

+0

I nodeod di Google leggono il file una riga alla volta, quindi eseguono l'espressione regolare tra '(..)' e hai la traccia dello stack da un file di testo. – cgTag

+0

Sì, è esattamente quello che sto pensando di fare. –

Problemi correlati