Waarom werkt mijn app in de preview wel en live niet?

Je app draait in de preview van je tool of op je eigen laptop, alles werkt, je zet hem live en de helft doet het niet. Frustrerend, maar bijna nooit mysterieus: er zijn vier oorzaken, en samen dekken ze vrijwel elk geval dat ik voorbij zie komen.

1. De sleutels staan er niet

Verreweg de meest voorkomende. Je database, je betaaldienst en je mail werken via sleutels die lokaal in een bestandje staan dat niet mee live gaat — en dat hoort ook zo. Op de nieuwe plek moeten ze opnieuw ingevoerd worden, en één ontbrekende sleutel betekent dat dat hele onderdeel stil valt, meestal zonder duidelijke melding.

Let ook op het verschil tussen sleutels die de browser mag zien en sleutels die alleen op de server horen. In veel frameworks bepaalt het voorvoegsel van de naam dat verschil. Wordt er eentje verkeerd om gebruikt, dan werkt het lokaal en niet live, of erger: het werkt live en iedereen kan erbij.

2. Iets dat alleen op jouw computer bestaat

Een verwijzing naar localhost, een pad naar een map op je eigen schijf, een bestand dat je zelf hebt neergezet maar dat niet in het project zit. Lokaal klopt dat allemaal; op een server bestaat het niet. Zoek in je project eens naar het woord localhost en je vindt ze meestal binnen een minuut.

3. Het onderscheid tussen server en browser

Moderne frameworks draaien een deel van je code op de server en een deel in de browser. Code die alleen in de browser mag draaien — alles wat het scherm of de muis aanraakt — geeft op de server een fout. In ontwikkeling is dat vaak nog een waarschuwing; bij het live zetten stopt de bouw ermee of blijft de pagina leeg.

Herken je dit aan een pagina die wit blijft terwijl de rest van de site werkt, dan zit je vrijwel zeker hier.

4. De database staat de bezoeker niet toe

Lokaal test je meestal ingelogd als jezelf, en soms zelfs met een sleutel die alles mag. Live komt er een echte bezoeker langs met minder rechten, en dan blijken de regels op je tabellen iets anders te zeggen dan je dacht. Symptoom: lege lijsten en lege schermen zonder foutmelding, want 'je mag niets zien' levert geen fout op maar nul resultaten.

Welke van de vier is het bij jou?

• Open je live site, druk op F12 en kijk in het tabblad Console. Een rode melding wijst meestal naar oorzaak 2 of 3.
• Kijk in het tabblad Network of de verzoeken naar je database een foutcode geven, of gewoon een lege lijst. Leeg zonder fout is oorzaak 4.
• Werkt er een heel onderdeel niet, zoals mail of betalen, terwijl de rest het doet? Dan is het oorzaak 1.
• Blijft één pagina wit terwijl de rest laadt, dan is het oorzaak 3.

Een preview is een geregisseerde omgeving. Live is de echte wereld, en die heeft geen van jouw aannames gelezen.

Hoe je dit voorgoed stopt

Door een tussenstap te maken: een omgeving die precies is ingericht als live, maar waar geen klanten komen. Daar zet je elke wijziging eerst neer. Dat is een half uur werk om op te zetten en het is het verschil tussen problemen ontdekken en problemen uitleggen aan een klant die belt.

Kom je er niet uit, stuur me dan een link met wat er misgaat. Dit soort dingen is meestal binnen een dag opgelost, en dan weet je meteen of er nog meer onder ligt.