Chrome పనిచేసింది. Firefox ఖాళీగా ఉంది.
నేను ఒక వింతైన బగ్ను చూశాను. నేను ఒకే పేజీని రెండు బ్రౌజర్లలో పక్కపక్కనే తెరిచాను.
Chromeలో, అంతా సరిగ్గా పనిచేసింది. నేను చిత్రాలు, బటన్లు మరియు డేటాను చూశాను. Firefoxలో, నాకు ఏమీ కనిపించలేదు. ఖాళీ కార్డ్లు మరియు "0 results found" అనే సందేశం మాత్రమే కనిపించాయి.
అది ఒకే URL. అది ఒకే బిల్డ్. అది ఒకే మెషిన్.
దీనికి కారణం డెవలప్మెంట్ సమయంలో కనుగొనడం దాదాపు అసాధ్యమైన ఒక బగ్. బ్రౌజర్ నా స్వంత API కాల్స్ను బ్లాక్ చేస్తోంది. ఏ బ్రౌజర్ అయితే వాటిని బ్లాక్ చేయలేదో, నేను కేవలం దానిలోనే డెవలప్మెంట్ చేశాను.
సమస్య: పేజీ థర్డ్-పార్టీ డొమైన్ (Supabase) నుండి డేటాను పొందడానికి JavaScriptని ఉపయోగిస్తుంది. Firefox 'Enhanced Tracking Protection'ని ఉపయోగిస్తుంది. చాలా మంది వినియోగదారులు uBlock Origin వంటి యాడ్ బ్లాకర్లను కూడా ఉపయోగిస్తారు. ఈ టూల్స్ థర్డ్-పార్టీ డొమైన్ను గుర్తించి, రిక్వెస్ట్ కంప్యూటర్ నుండి బయటకు వెళ్ళకముందే దానిని బ్లాక్ చేస్తాయి.
కోడ్ క్రాష్ కాలేదు. కన్సోల్లో ఎటువంటి ఎర్రర్ కూడా చూపలేదు. fetch కేవలం ఏమీ తిరిగి ఇవ్వలేదు. అప్పుడు నా కోడ్ సూచించిన విధంగా ఒక ఫాల్బ్యాక్ "empty state"ను చూపించింది. పైకి చూసేవారికి, పేజీ అంతా బానే ఉన్నట్లు అనిపించింది. అది కేవలం ఖాళీగా ఉన్నట్లు మాత్రమే అనిపించింది.
ఈ బగ్ రెండు కారణాల వల్ల కనిపించలేదు:
- నేను Chromeలో డెవలప్ చేశాను, అది ఆ కాల్ను అనుమతించింది.
- నా అనలిటిక్స్ కూడా అదే API డొమైన్ను ఉపయోగించాయి. కంటెంట్ కనిపించని వినియోగదారులు నా డేటాలో కూడా లెక్కించబడలేదు.
నేను దీన్ని ఎలా పరిష్కరించాను:
రిక్వెస్ట్ను నమ్మదగిన వైపుకు మార్చడానికి నేను రివర్స్ ప్రాక్సీని (reverse proxy) ఉపయోగించాను.
దీనికి బదులుగా: mysite.com -> xxxx.supabase.co (Third-party / Blocked)
నేను దీనికి మారాను: mysite.com -> mysite.com/sb-api (First-party / Trusted)
APIని నా స్వంత డొమైన్ ద్వారా రూట్ చేయడం వల్ల, బ్రౌజర్ ఆ రిక్వెస్ట్ సైట్లో భాగమే అని భావిస్తుంది. Firefox ఇకపై దానిని ట్రాకర్గా చూడదు.
మీరు ఈ పద్ధతిని ఉపయోగిస్తే గుర్తుంచుకోవలసిన మూడు విషయాలు:
- మీ websocketsలను తనిఖీ చేయండి. సాధారణ రీరైట్లు (rewrites) రియల్-టైమ్ ఫీచర్లను దెబ్బతీయవచ్చు.
- మీ auth storage కీని పిన్ చేయండి. URL మార్చడం వల్ల బ్రౌజర్ లాగిన్ సెషన్లను ఎలా స్టోర్ చేస్తుందనేది మారవచ్చు.
- సర్వర్-సైడ్ కాల్స్ను నేరుగా ఉంచండి. బ్రౌజర్లో రన్ కాని కోడ్ కోసం మీకు ప్రాక్సీ అవసరం లేదు.
పాఠం: "Chromeలో పనిచేస్తే, అంతా పనిచేస్తుంది" అని అనుకోవడం మానేయండి.
మీ సైట్ను కఠినమైన ప్రైవసీ సెట్టింగ్లు మరియు యాడ్ బ్లాకర్తో Firefoxలో పరీక్షించండి. అదే మీ అసలైన బ్లైండ్ స్పాట్.