సబ్స్క్రిప్షన్లు లేకుండా లైవ్ వెబ్సైట్ సందర్శకులను ట్రాక్ చేయండి
ఒక క్లయింట్ తమ వెబ్సైట్లో రియల్ టైమ్లో ఎవరు ఉన్నారో చూడాలనుకున్నారు.
వారికి Tidio విడ్జెట్ నచ్చింది కానీ సబ్స్క్రిప్షన్ కోసం డబ్బులు చెల్లించాలనుకోలేదు.
ఈ సవాలులో రెండు భాగాలు ఉన్నాయి:
- సైట్ వేర్వేరు హోస్టింగ్ ప్లాట్ఫామ్లపై WordPressని ఉపయోగిస్తోంది.
- నేను WordPress సెటప్కు నేరుగా Firebaseని జోడించలేకపోయాను.
నేను Firebase ఉపయోగించి ఒక ఎక్స్టర్నల్ ట్రాకర్ను రూపొందించాను. అది ఎలా పనిచేస్తుందో ఇక్కడ ఉంది.
పరిష్కారం
నేను WordPress హెడర్లో ఒకే ఒక స్క్రిప్ట్ ట్యాగ్ను ఉపయోగించాను. ఈ స్క్రిప్ట్ ఒక స్వతంత్ర Firebase ప్రాజెక్ట్కు కనెక్ట్ అవుతుంది.
• లైవ్ ప్రెజెన్స్ (Live Presence): నేను onDisconnect() ఫంక్షన్తో Firebase Realtime Databaseని ఉపయోగించాను. వినియోగదారు తమ ట్యాబ్ను మూసివేసినప్పుడు లేదా కనెక్షన్ కోల్పోయినప్పుడు, ఇది వారిని ఆటోమేటిక్గా "online" జాబితా నుండి తొలగిస్తుంది.
• విజిటర్ హిస్టరీ (Visitor History): Firestoreలో డేటాను రాయడానికి నేను Netlify Functionని ఉపయోగించాను. ఇది సర్వర్-సైడ్ IP జియోలొకేషన్ను అనుమతిస్తుంది.
• సెక్యూరిటీ (Security): నేను అనోనిమస్ అథెంటికేషన్ను ఉపయోగించాను. సందర్శకులు కేవలం వారి స్వంత సెషన్ నోడ్కు మాత్రమే డేటాను రాయగలరు. అడ్మిన్ మాత్రమే పూర్తి జాబితాను చదవగలరు.
ఎదురైన క్లిష్టమైన సమస్యలు (Bugs)
దీనిని నిర్మించడం అంత సులభం కాలేదు. నేను మూడు ప్రధాన సాంకేతిక అడ్డంకులను ఎదుర్కొన్నాను.
1. క్యాషింగ్ ట్రాప్ (The Caching Trap)
హిస్టరీలో సున్నా సెషన్లు కనిపిస్తున్నాయి. ట్రాకర్ స్క్రిప్ట్కు ఒక సంవత్సరం క్యాష్ పాలసీ ఉందని నేను తెలుసుకున్నాను. సందర్శకులు పాత వెర్షన్ స్క్రిప్ట్నే వాడుతూ ఉండటం వల్ల ఈ సమస్య వచ్చింది.
- పరిష్కారం: నేను ట్రాకర్ స్క్రిప్ట్ కోసం ఐదు నిమిషాల క్యాష్ పాలసీని సెట్ చేశాను.
2. నకిలీ CORS ఎర్రర్ (The Fake CORS Error)
బ్రౌజర్ CORS ఎర్రర్ను చూపించింది. నాకు డొమైన్ వైట్లిస్ట్ సమస్య ఉందని అనుకున్నాను. కానీ ఒక సాధారణ curl టెస్ట్ ద్వారా సర్వర్ బాగానే పనిచేస్తుందని తెలిసింది.
అసలు విషయం వేరే ఉంది. సర్వర్ నిజానికి క్రాష్ అవుతోంది.
Node.jsలో, మీరు 204 స్టేటస్ కోడ్ని ఉపయోగిస్తే, బాడీగా ఖాళీ స్ట్రింగ్ను ఉపయోగించలేరు. మీరు తప్పనిసరిగా null ఉపయోగించాలి. CORS హెడర్లు పంపకముందే ఆ ఖాళీ స్ట్రింగ్ వల్ల సర్వర్ క్రాష్ అయ్యింది. హెడర్లు లేకపోవడంతో బ్రౌజర్ దానిని CORS సమస్యగా భావించింది.
- పరిష్కారం: రెస్పాన్స్ బాడీని
''నుండిnullకి మార్చాను.
3. డేటా మిస్సింగ్ గ్యాప్ (The Missing Data Gap)
"Today" లేదా "Last 7 Days" ఫిల్టర్లు ఏమీ చూపించలేదు. కొంతమంది వినియోగదారుల లొకేషన్లు "Unknown" అని వచ్చాయి. నేను కేవలం మొదటిసారి పేజీ లోడ్ అయినప్పుడు మాత్రమే టైమ్స్టాంప్ మరియు లొకేషన్ను లెక్కించడం వల్ల ఇది జరిగింది. వినియోగదారు బ్రౌజర్లో పాత సెషన్ ఉంటే, సర్వర్ "start" ఈవెంట్ను గుర్తించలేకపోయింది.
- పరిష్కారం: నేను లెక్కించే విధానాన్ని ఐడెంపోటెంట్ (idempotent) గా మార్చాను. ఇప్పుడు ప్రతి ఈవెంట్పై స్క్రిప్ట్ ఈ విలువలను మళ్ళీ లెక్కిస్తుంది.
ముఖ్యమైన అంశాలు
• బ్రౌజర్లో కనిపించే CORS ఎర్రర్ ఎప్పుడూ కాన్ఫిగరేషన్ సమస్య కాకపోవచ్చు. అది సర్వర్ క్రాష్ను కూడా దాచవచ్చు. ఎల్లప్పుడూ మీ సర్వర్ లాగ్లను తనిఖీ చేయండి.
• curl POST టెస్ట్ బ్రౌజర్ను పరీక్షించలేదు. బ్రౌజర్లు మొదట OPTIONS preflight రిక్వెస్ట్ను పంపుతాయి. మీ టెస్ట్ సరైనదిగా ఉండాలంటే ఇందులో ఇది కూడా ఉండాలి.
• 204 వంటి "no content" HTTP స్టేటస్ల కోసం null ఉపయోగించండి. ఖాళీ స్ట్రింగ్లను ఉపయోగించవద్దు.