ಡಿಪ್ಲಾಯ್ ಮಾಡಿದ ನಂತರ ವೆಬ್ಸೈಟ್ ಅಥವಾ ಆಪ್ನ 404 ದೋಷಗಳನ್ನು ಸರಿಪಡಿಸುವುದು ಹೇಗೆ
ನಿಮ್ಮ ಆಪ್ ಸ್ಥಳೀಯವಾಗಿ ಕೆಲಸ ಮಾಡುತ್ತದೆ ಆದರೆ ಡಿಪ್ಲಾಯ್ ನಂತರ ಪುಟಗಳು 404 ತೋರಿಸಿದರೆ, ಸಾಮಾನ್ಯ ಕಾರಣ ಸಿಂಗಲ್-ಪೇಜ್ ಆಪ್ (SPA) ರೂಟಿಂಗ್ ಕಾಣೆಯಾಗಿರುವುದು: ಸರ್ವರ್ /dashboard ಎಂಬ ಫೈಲ್ ಹುಡುಕುತ್ತದೆ, ಅದು ಇರುವುದಿಲ್ಲ, ಏಕೆಂದರೆ ಆ ರೂಟ್ JavaScript ಒಳಗೆ ಮಾತ್ರ ಅಸ್ತಿತ್ವದಲ್ಲಿದೆ. ಪರಿಹಾರ: ಆಪ್ ರೂಟ್ಗಳಿಗೆ index.html ನೀಡುವ ಫಾಲ್ಬ್ಯಾಕ್ ನಿಯಮ. ಇತರ ಕಾರಣಗಳು: ಬಿಲ್ಡ್ ಔಟ್ಪುಟ್ನಲ್ಲಿ ಫೈಲ್ಗಳ ಕೊರತೆ, ದೊಡ್ಡ-ಸಣ್ಣ ಅಕ್ಷರದ ಮಾರ್ಗಗಳು, ಕೊನೆಯ ಸ್ಲ್ಯಾಷ್ ವ್ಯತ್ಯಾಸ, ತಪ್ಪಾದ base path, ಮತ್ತು ಡಿಪ್ಲಾಯ್ ಆಗದ API ರೂಟ್ಗಳು.
ನೀವು ಯಾವ URL 404 ಆಗುತ್ತಿದೆ ಮತ್ತು ನೀವು ಅದನ್ನು ಹೇಗೆ ತಲುಪಿದಿರಿ ಎಂಬುದನ್ನು ಗಮನಿಸುವ ಮೂಲಕ ಆರಂಭಿಸಿ. ಮಾದರಿಯೇ ನೇರವಾಗಿ ಕಾರಣಕ್ಕೆ ಸೂಚಿಸುತ್ತದೆ.
ಹಂತ 1: ಮಾದರಿಯನ್ನು ಗುರುತಿಸಿ
| ನೀವು ಏನು ನೋಡುತ್ತೀರಿ | ಬಹುಶಃ ಕಾರಣ | ಎಲ್ಲಿಗೆ ಹೋಗಬೇಕು |
|---|---|---|
| ಮುಖ್ಯ ಪುಟ ಕೆಲಸ ಮಾಡುತ್ತದೆ; ಲಿಂಕ್ಗಳು ಕೆಲಸ ಮಾಡುತ್ತವೆ; ಆದರೆ ರಿಫ್ರೆಶ್ ಅಥವಾ ನೇರ ಲಿಂಕ್ 404 | SPA ಫಾಲ್ಬ್ಯಾಕ್ ಇಲ್ಲ | ಹಂತ 2 |
| ಪ್ರತಿ ಪುಟ 404, ಮುಖ್ಯ ಪುಟ ಸೇರಿ | ತಪ್ಪು ಫೋಲ್ಡರ್ ಪ್ರಕಟವಾಗಿದೆ, ಅಥವಾ ಬಿಲ್ಡ್ ಡಿಪ್ಲಾಯ್ ಆಗಲಿಲ್ಲ | ಹಂತ 3 |
| ಪುಟಗಳು ಲೋಡ್ ಆಗುತ್ತವೆ, ಆದರೆ ಚಿತ್ರಗಳು, ಫಾಂಟ್ಗಳು ಅಥವಾ ಸ್ಕ್ರಿಪ್ಟ್ಗಳು 404 | ಬಿಲ್ಡ್ನಲ್ಲಿ ಫೈಲ್ಗಳ ಕೊರತೆ, ಅಥವಾ ತಪ್ಪು ಮಾರ್ಗಗಳು | ಹಂತ 4 |
/about/ ಕೆಲಸ ಮಾಡುತ್ತದೆ, /about ವಿಫಲ (ಅಥವಾ ಉಲ್ಟಾ) | ಕೊನೆಯ ಸ್ಲ್ಯಾಷ್ ನಿರ್ವಹಣೆ | ಹಂತ 5 |
/About ವಿಫಲ ಆದರೆ /about ಕೆಲಸ ಮಾಡುತ್ತದೆ | ಕೇಸ್-ಸೆನ್ಸಿಟಿವ್ ಸರ್ವರ್ | ಹಂತ 4 |
ಪುಟ ಲೋಡ್ ಆಗುತ್ತದೆ, ಆದರೆ /api/... ಡೇಟಾ ಕರೆಗಳು 404 | API ಡಿಪ್ಲಾಯ್ ಆಗಿಲ್ಲ ಅಥವಾ ರೂಟ್ ಆಗಿಲ್ಲ | ಹಂತ 6 |
| ಹಳೆಯ ಸೈಟ್ನ ಹಳೆಯ URLಗಳು 404 | ಕಾಣೆಯಾದ ರೀಡೈರೆಕ್ಟ್ಗಳು | ಹಂತ 7 |
| ಕಸ್ಟಮ್ ಡೊಮೇನ್ನಲ್ಲಿ ಮಾತ್ರ | DNS ಅಥವಾ ಡೊಮೇನ್ ಸೆಟಪ್ | ಹಂತ 8 |
ನಿಜವಾದ ಸ್ಥಿತಿ ಕೋಡ್ ನೋಡಲು, ಡೆವಲಪರ್ ಟೂಲ್ಗಳನ್ನು ತೆರೆಯಿರಿ (ರೈಟ್-ಕ್ಲಿಕ್ → Inspect), Network ಟ್ಯಾಬ್ಗೆ ಹೋಗಿ, ರಿಲೋಡ್ ಮಾಡಿ, ಮತ್ತು ಮೊದಲ ವಿನಂತಿಯ ಸ್ಥಿತಿಯನ್ನು ನೋಡಿ.
ಹಂತ 2: SPA ಫಾಲ್ಬ್ಯಾಕ್ ಸೇರಿಸಿ
ಇದು ಕ್ಲಾಸಿಕ್ ಸಮಸ್ಯೆ. React, Vue ಅಥವಾ Svelte ಸಿಂಗಲ್-ಪೇಜ್ ಆಪ್ನಲ್ಲಿ ಸರ್ವರ್ನಲ್ಲಿ ಕೆಲವೇ ನಿಜವಾದ ಫೈಲ್ಗಳಿರುತ್ತವೆ: index.html ಮತ್ತು ಕೆಲವು JavaScript ಹಾಗೂ CSS. /dashboard ಅಥವಾ /projects/42 ನಂತಹ ರೂಟ್ಗಳನ್ನು ಬ್ರೌಸರ್ನಲ್ಲಿರುವ ರೂಟರ್ ನಿರ್ವಹಿಸುತ್ತದೆ.
- ಲಿಂಕ್ ಕ್ಲಿಕ್ ಮಾಡುವುದು ಕೆಲಸ ಮಾಡುತ್ತದೆ: ರೂಟರ್ URL ಬದಲಿಸಿ ಸರ್ವರ್ ಕೇಳದೆ ಹೊಸ ಪುಟ ಚಿತ್ರಿಸುತ್ತದೆ.
- ರಿಫ್ರೆಶ್ ಮಾಡುವುದು ಅಥವಾ ಲಿಂಕ್ ನೇರವಾಗಿ ತೆರೆಯುವುದು ವಿಫಲವಾಗುತ್ತದೆ: ಬ್ರೌಸರ್ ಸರ್ವರ್ನಿಂದ
/dashboardಕೇಳುತ್ತದೆ, ಅಂತಹ ಫೈಲ್ ಇಲ್ಲ, ಮತ್ತು ಅದು 404 ಹಿಂತಿರುಗಿಸುತ್ತದೆ.
ಪರಿಹಾರ ಒಂದು ನಿಯಮ: ವಿನಂತಿ ನಿಜವಾದ ಫೈಲ್ಗೆ ಹೊಂದದಿದ್ದರೆ, index.html ಅನ್ನು 200 ಸ್ಥಿತಿಯೊಂದಿಗೆ ನೀಡಿ, ರೂಟರ್ಗೆ ನಿಯಂತ್ರಣ ಬಿಡಿ. ಇದನ್ನು ಹೇಗೆ ಸೇರಿಸಬೇಕು ಎಂಬುದು ಹೋಸ್ಟ್ ಮೇಲೆ ಅವಲಂಬಿತ (ಬದಲಾವಣೆಗಳಿರುವುದರಿಂದ ಹೋಸ್ಟ್ನ ಪ್ರಸ್ತುತ ಡಾಕ್ಸ್ ಪರಿಶೀಲಿಸಿ):
| ಹೋಸ್ಟ್ | ಸಾಮಾನ್ಯ ಫಾಲ್ಬ್ಯಾಕ್ ನಿಯಮ |
|---|---|
| Netlify | ಪ್ರಕಟಿತ ಫೋಲ್ಡರ್ನಲ್ಲಿ /* /index.html 200 ಇರುವ _redirects ಫೈಲ್ |
| Vercel | ಎಲ್ಲಾ ಮಾರ್ಗಗಳನ್ನು /index.html ಗೆ ಕಳುಹಿಸುವ vercel.json ನಲ್ಲಿ rewrite (ಫ್ರೇಮ್ವರ್ಕ್ ಪ್ರೀಸೆಟ್ಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಇದನ್ನು ನಿರ್ವಹಿಸುತ್ತವೆ) |
| Cloudflare Pages | ಮೇಲ್ಮಟ್ಟದ 404.html ಇಲ್ಲದಿದ್ದರೆ ಡೀಫಾಲ್ಟ್ ಆಗಿ SPA-ಶೈಲಿಯ ಫಾಲ್ಬ್ಯಾಕ್ ನೀಡುತ್ತದೆ |
| Nginx | location / ಬ್ಲಾಕ್ನಲ್ಲಿ try_files $uri $uri/ /index.html; |
| Apache | ನಿಜವಲ್ಲದ ವಿನಂತಿಗಳನ್ನು index.html ಗೆ ಕಳುಹಿಸುವ .htaccess ನಲ್ಲಿ rewrite ನಿಯಮ |
| GitHub Pages | ಸರ್ವರ್-ಬದಿ rewrite ಇಲ್ಲ; ಸಾಮಾನ್ಯ ಪರ್ಯಾಯಗಳು hash ರೂಟಿಂಗ್ ಅಥವಾ ರೀಡೈರೆಕ್ಟ್ ಮಾಡುವ 404.html |
ನಿಯಮ ನಿಜವಾದ ಫೈಲ್ಗಳನ್ನು ಮುಚ್ಚದಂತೆ ನೋಡಿಕೊಳ್ಳಿ: /assets/app.js ಗೆ ವಿನಂತಿಗಳು ಇನ್ನೂ JavaScript ಫೈಲ್ ನೀಡಬೇಕು. ಬದಲಿಗೆ index.html ಬಂದರೆ, "Failed to load module script" ದೋಷದೊಂದಿಗೆ ಖಾಲಿ ಪುಟ ಸಿಗುತ್ತದೆ. ನೋಡಿ ಖಾಲಿ ಬಿಳಿ ಪುಟವನ್ನು ಸರಿಪಡಿಸುವುದು.
ಯಾವ URL ಯಾವುದೇ ಪುಟಕ್ಕೆ ಹೊಂದುವುದಿಲ್ಲವೋ ಅದು ಸ್ನೇಹಪರ "Page not found" ತೋರಿಸುವಂತೆ, ರೂಟರ್ಗೆ ಕ್ಯಾಚ್-ಆಲ್ ರೂಟ್ ಕೊಡಿ.
ಸರ್ವರ್ ಸೆಟ್ಟಿಂಗ್ ಬದಲಿಸಲಾಗದಿದ್ದರೆ, hash ರೂಟಿಂಗ್ (/#/dashboard ನಂತಹ URLಗಳು) ಸಮಸ್ಯೆಯನ್ನು ತಪ್ಪಿಸುತ್ತದೆ, ಏಕೆಂದರೆ # ನಂತರದ ಭಾಗ ಎಂದಿಗೂ ಸರ್ವರ್ಗೆ ಕಳುಹಿಸಲ್ಪಡುವುದಿಲ್ಲ. ಇದು ಮೊದಲ ಆಯ್ಕೆಯಲ್ಲ, ಒಂದು ಪರ್ಯಾಯ ಮಾರ್ಗ ಮಾತ್ರ: URLಗಳು ಕುರೂಪವಾಗಿರುತ್ತವೆ ಮತ್ತು ಸರ್ಚ್ ಎಂಜಿನ್ಗಳಿಗೆ ಕಡಿಮೆ ಸ್ನೇಹಪರ.
ಸರ್ವರ್-ಬದಿ ರೆಂಡರ್ ಮಾಡುವ ಅಥವಾ ಬಿಲ್ಡ್ ಸಮಯದಲ್ಲಿ ಪುಟಗಳನ್ನು ಉತ್ಪಾದಿಸುವ ಫ್ರೇಮ್ವರ್ಕ್ಗಳು (Next.js, Astro ಮತ್ತು ಇತರೆ) ಸಾಮಾನ್ಯವಾಗಿ ಪ್ರತಿ ಪುಟಕ್ಕೂ ನಿಜವಾದ ಫೈಲ್ಗಳು ಅಥವಾ ಸರ್ವರ್ ರೂಟ್ಗಳನ್ನು ಹೊಂದಿರುತ್ತವೆ, ಆದ್ದರಿಂದ ಈ ನಿರ್ದಿಷ್ಟ ಸಮಸ್ಯೆ ಅಲ್ಲಿ ಕಡಿಮೆ. ಅವುಗಳ ಸಮಾನ ಸಮಸ್ಯೆ: ಬಿಲ್ಡ್ ಸಮಯದಲ್ಲಿ ಉತ್ಪಾದಿಸದ ಪುಟ.
ಹಂತ 3: ನಿಜವಾಗಿ ಏನು ಡಿಪ್ಲಾಯ್ ಆಗಿದೆ ಪರಿಶೀಲಿಸಿ
ಎಲ್ಲವೂ 404 ಆದರೆ, ಸರ್ವರ್ ಬಹುಶಃ ನಿಮ್ಮ ಬಿಲ್ಟ್ ಆಪ್ ಅನ್ನು ಸರ್ವ್ ಮಾಡುತ್ತಿಲ್ಲ.
- ಸರಿಯಾದ ಫೋಲ್ಡರ್. ಹೋಸ್ಟ್ ಬಿಲ್ಡ್ ಔಟ್ಪುಟ್ ಪ್ರಕಟಿಸಬೇಕು (Vite ಗೆ ಸಾಮಾನ್ಯವಾಗಿ
dist, Create React App ಗೆbuild, ಸ್ಥಿರ Next.js ಎಕ್ಸ್ಪೋರ್ಟ್ಗೆout), ಪ್ರಾಜೆಕ್ಟ್ ರೂಟ್ ಅಲ್ಲ. - ಬಿಲ್ಡ್ ನಡೆಯಿತು. ಡಿಪ್ಲಾಯ್ ಲಾಗ್ ಓದಿ. ಬಿಲ್ಡ್ ವಿಫಲವಾದರೆ, ಹೋಸ್ಟ್ ಏನನ್ನೂ ಅಥವಾ ಹಳೆಯ ಆವೃತ್ತಿಯನ್ನು ಡಿಪ್ಲಾಯ್ ಮಾಡಿರಬಹುದು.
index.htmlಪ್ರಕಟಿತ ಫೋಲ್ಡರ್ನ ಮೇಲ್ಮಟ್ಟದಲ್ಲಿ ಇರಬೇಕು, ಉಪ-ಫೋಲ್ಡರ್ನಲ್ಲಿ ಅಲ್ಲ.- Base path ಹೊಂದುತ್ತದೆ. ಆಪ್
example.com/app/ನಿಂದ ಸರ್ವ್ ಆಗುತ್ತಿದ್ದರೆ, ಆ base ನೊಂದಿಗೆ ಬಿಲ್ಡ್ ಆಗಬೇಕು (Vite ನbase, React Router ನbasename), ಇಲ್ಲದಿದ್ದರೆ ಪ್ರತಿ ರೂಟ್ ಮತ್ತು ಅಸೆಟ್ ತಪ್ಪುತ್ತದೆ.
ಹಂತ 4: ಕಾಣೆಯಾದ ಫೈಲ್ಗಳು ಮತ್ತು ತಪ್ಪು ಮಾರ್ಗಗಳನ್ನು ಸರಿಪಡಿಸಿ
ಪುಟಗಳು ಲೋಡ್ ಆಗುತ್ತವೆ ಆದರೆ ಅಸೆಟ್ಗಳು 404 ಆದಾಗ:
- ದೊಡ್ಡ-ಸಣ್ಣ ಅಕ್ಷರ ಸೂಕ್ಷ್ಮತೆ. macOS ಮತ್ತು Windows ಸಾಮಾನ್ಯವಾಗಿ
Logo.pngಮತ್ತುlogo.pngಅನ್ನು ಒಂದೇ ಫೈಲ್ ಎಂದು ಪರಿಗಣಿಸುತ್ತವೆ. ಹೆಚ್ಚಿನ Linux ಸರ್ವರ್ಗಳು ಹಾಗೆ ಮಾಡುವುದಿಲ್ಲ. ಪ್ರತಿ ಉಲ್ಲೇಖವನ್ನು ನಿಜವಾದ ಫೈಲ್ ಹೆಸರಿಗೆ ನಿಖರವಾಗಿ ಹೊಂದಿಸಿ. - ಬಿಲ್ಡ್ ಹೊರಗಿನ ಫೈಲ್ಗಳು. Vite ನಲ್ಲಿ
public/ನಲ್ಲಿರುವ ಫೈಲ್ಗಳನ್ನು ಹಾಗೆಯೇ ನಕಲಿಸಿ ರೂಟ್ನಿಂದ ಉಲ್ಲೇಖಿಸಲಾಗುತ್ತದೆ (/logo.png). ಕೋಡ್ನಲ್ಲಿ import ಮಾಡಿದ ಫೈಲ್ಗಳು ಬಂಡಲ್ ಆಗುತ್ತವೆ. ಪ್ರಾಜೆಕ್ಟ್ನ ಬೇರೆಡೆ ಇರುವ ಫೈಲ್ ಡಿಪ್ಲಾಯ್ ಆಗದೇ ಇರಬಹುದು. - ಸಾಪೇಕ್ಷ ಮಾರ್ಗಗಳು.
images/photo.jpgಪ್ರಸ್ತುತ URL ಗೆ ಸಾಪೇಕ್ಷವಾಗಿ ಪರಿಹರಿಸಲ್ಪಡುವುದರಿಂದ/blog/post-1ನಲ್ಲಿ ಮುರಿಯುತ್ತದೆ./images/photo.jpgಬಳಸಿ. - ಸ್ಥಳೀಯ ಡಿಸ್ಕ್ಗೆ ಉಳಿಸಲಾದ ಅಪ್ಲೋಡ್ಗಳು. ಬಳಕೆದಾರರ ಅಪ್ಲೋಡ್ಗಳು ಸರ್ವರ್ನ ಸ್ವಂತ ಫೋಲ್ಡರ್ಗೆ ಬರೆಯಲ್ಪಟ್ಟಿದ್ದರೆ, ಹೊಸ ಆವೃತ್ತಿ ಡಿಪ್ಲಾಯ್ ಆದಾಗ ಅವು ಮಾಯವಾಗುತ್ತವೆ. ಸರಿಯಾದ ಫೈಲ್ ಸಂಗ್ರಹಣೆ ಬಳಸಿ.
ಹಂತ 5: ಕೊನೆಯ ಸ್ಲ್ಯಾಷ್ಗಳನ್ನು ಸ್ಥಿರವಾಗಿ ನಿರ್ವಹಿಸಿ
/about ಮತ್ತು /about/ ಬೇರೆ ಬೇರೆ URLಗಳು. ಹೋಸ್ಟ್ಗಳು ಕೊನೆಯ ಸ್ಲ್ಯಾಷ್ ಸೇರಿಸುತ್ತವೆಯೇ ಅಥವಾ ತೆಗೆಯುತ್ತವೆಯೇ ಎಂಬುದರಲ್ಲಿ ಭಿನ್ನವಾಗಿರುತ್ತವೆ, ಮತ್ತು ನಿಮ್ಮ ಲಿಂಕ್ಗಳು ಅಥವಾ ರೂಟರ್ನೊಂದಿಗೆ ಹೊಂದಾಣಿಕೆಯಾಗದಿರುವುದು 404 ಅಥವಾ ರೀಡೈರೆಕ್ಟ್ ಲೂಪ್ಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು. ಒಂದು ಶೈಲಿ ಆಯ್ಕೆಮಾಡಿ, ನಿಮ್ಮ ಲಿಂಕ್ಗಳು ಅದನ್ನೇ ಬಳಸಲಿ, ಮತ್ತು ಇನ್ನೊಂದು ರೂಪವನ್ನು ಇದಕ್ಕೆ ರೀಡೈರೆಕ್ಟ್ ಮಾಡಲು ಹೋಸ್ಟ್ ಕಾನ್ಫಿಗರ್ ಮಾಡಿ. ಸ್ಥಿರತೆ ಸರ್ಚ್ ಎಂಜಿನ್ಗಳಿಗೂ ಸಹಾಯಕ, ಇಲ್ಲದಿದ್ದರೆ ಅವು ಪ್ರತಿ ಪುಟದ ಎರಡು ಪ್ರತಿಗಳನ್ನು ನೋಡಬಹುದು.
ಹಂತ 6: 404 ಆಗುವ API ರೂಟ್ಗಳನ್ನು ಸರಿಪಡಿಸಿ
ಪುಟ ಲೋಡ್ ಆಗುತ್ತದೆ ಆದರೆ Network ಟ್ಯಾಬ್ /api/... ವಿನಂತಿಗಳು 404 ತೋರಿಸಿದರೆ:
- ಬ್ಯಾಕೆಂಡ್ ಡಿಪ್ಲಾಯ್ ಆಗಿಲ್ಲ. ಸ್ಥಿರ ಹೋಸ್ಟ್ ಫೈಲ್ಗಳನ್ನು ಮಾತ್ರ ಸರ್ವ್ ಮಾಡುತ್ತದೆ; ಬ್ಯಾಕೆಂಡ್ ಎಲ್ಲೋ ಚಲಿಸಬೇಕು.
- ಪ್ರೊಡಕ್ಷನ್ನಲ್ಲಿ ಮಾರ್ಗ ಬೇರೆ ರೀತಿ ರೂಟ್ ಆಗುತ್ತದೆ. ಡೆವಲಪ್ಮೆಂಟ್ನಲ್ಲಿ ಪ್ರಾಕ್ಸಿ
/apiಅನ್ನು ಬೇರೆ ಸರ್ವರ್ಗೆ ಫಾರ್ವರ್ಡ್ ಮಾಡಿರಬಹುದು. ಪ್ರೊಡಕ್ಷನ್ನಲ್ಲಿ ಹೋಸ್ಟ್ಗೆ ಸಮಾನ rewrite ಬೇಕು, ಅಥವಾ ಫ್ರಂಟ್ಎಂಡ್ API ನ ನಿಜವಾದ ವಿಳಾಸವನ್ನು ಕರೆಯಬೇಕು. - SPA ಫಾಲ್ಬ್ಯಾಕ್ ಅದನ್ನು ಹಿಡಿದಿದೆ. API ವಿನಂತಿ 200 ಸ್ಥಿತಿಯೊಂದಿಗೆ
index.htmlಹಿಂತಿರುಗಿಸಿದರೆ, ಫಾಲ್ಬ್ಯಾಕ್ ನಿಯಮ ತುಂಬಾ ವಿಶಾಲವಾಗಿದೆ./api/*ಅನ್ನು ಅದರಿಂದ ಹೊರಗಿಡಿ.
ಪ್ರಕಟಿತ ಆಪ್ನ /api/orders ವಿನಂತಿಗಳು 404 ಹಿಂತಿರುಗಿಸುತ್ತವೆ, ಆದರೆ ಪ್ರಿವ್ಯೂನಲ್ಲಿ ಕೆಲಸ ಮಾಡುತ್ತವೆ. ಪ್ರಿವ್ಯೂ ಮತ್ತು ಪ್ರಕಟಿತ ಆಪ್ನಲ್ಲಿ /api ಹೇಗೆ ರೂಟ್ ಆಗುತ್ತದೆ ಪರಿಶೀಲಿಸಿ, ಮತ್ತು ಪ್ರಕಟಿತ ಫ್ರಂಟ್ಎಂಡ್ ಬ್ಯಾಕೆಂಡ್ ಅನ್ನು ಅದೇ ರೀತಿಯಲ್ಲಿ ತಲುಪುವಂತೆ ಮಾಡಿ.
ಹಂತ 7: ಹಳೆಯ URLಗಳನ್ನು ರೀಡೈರೆಕ್ಟ್ ಮಾಡಿ
ಬೇರೆ ಸೈಟ್ನಿಂದ ಸ್ಥಳಾಂತರಿಸಿದ್ದರೆ ಅಥವಾ ರಚನೆ ಬದಲಿಸಿದ್ದರೆ, ಜನರು ಮತ್ತು ಸರ್ಚ್ ಎಂಜಿನ್ಗಳು ಇನ್ನೂ ಬಳಸುವ ಹಳೆಯ URLಗಳು 404 ಆಗುತ್ತವೆ. ಪ್ರತಿ ಹಳೆಯ URL ನಿಂದ ಅದರ ಹೊಸ ಸ್ಥಳಕ್ಕೆ 301 (ಶಾಶ್ವತ) ರೀಡೈರೆಕ್ಟ್ ಸೇರಿಸಿ. ಪಟ್ಟಿ ಇಟ್ಟುಕೊಳ್ಳಿ ಮತ್ತು ಲಾಂಚ್ ನಂತರ ಮಾದರಿಯನ್ನು ಪರೀಕ್ಷಿಸಿ. ಆ ಪಟ್ಟಿ ತಯಾರಿಸಲು WordPress ಸೈಟ್ ಸ್ಥಳಾಂತರಿಸುವುದು ಹೇಗೆ ಮಾರ್ಗದರ್ಶಿ ನೆರವಾಗುತ್ತದೆ.
ಹಂತ 8: ಡೊಮೇನ್ ಪರಿಶೀಲಿಸಿ
ಆಪ್ ಹೋಸ್ಟ್ನ ವಿಳಾಸದಲ್ಲಿ ಕೆಲಸ ಮಾಡುತ್ತದೆ ಆದರೆ ನಿಮ್ಮ ಕಸ್ಟಮ್ ಡೊಮೇನ್ನಲ್ಲಿ 404 ಆದರೆ, ಡೊಮೇನ್ ತಪ್ಪಾದ ಪ್ರಾಜೆಕ್ಟ್ಗೆ ತೋರಿಸುತ್ತಿರಬಹುದು, ಅಥವಾ ಹೋಸ್ಟ್ನಲ್ಲಿ ನಿಮ್ಮ ಸೈಟ್ಗೆ ಡೊಮೇನ್ ಇನ್ನೂ ಜೋಡಣೆಯಾಗಿಲ್ಲದಿರಬಹುದು. DNS ರೆಕಾರ್ಡ್ಗಳು ಮತ್ತು ಹೋಸ್ಟ್ನ ಡೊಮೇನ್ ಸೆಟ್ಟಿಂಗ್ಗಳನ್ನು ಪರಿಶೀಲಿಸಿ. ನೋಡಿ ಕಸ್ಟಮ್ ಡೊಮೇನ್ ಸಂಪರ್ಕಿಸುವುದು ಹೇಗೆ.
ಅಸ್ತಿತ್ವದಲ್ಲಿಲ್ಲದ ಪುಟಕ್ಕೆ ಸಹಾಯಕ 404 ಪುಟ
ಕೆಲವು 404ಗಳು ಸರಿಯಾಗಿವೆ: ಒಬ್ಬರು URL ತಪ್ಪಾಗಿ ಟೈಪ್ ಮಾಡಿದ್ದಾರೆ. ಆ ಪುಟವನ್ನು ಸಹಾಯಕವಾಗಿಸಿ:
- ಒಂದು ಸಣ್ಣ ಸಂದೇಶ ಮತ್ತು ಮುಖ್ಯ ಪುಟ ಹಾಗೂ ಪ್ರಮುಖ ವಿಭಾಗಗಳಿಗೆ ಲಿಂಕ್ಗಳು
- ಸೈಟ್ನಲ್ಲಿ ಹುಡುಕಾಟ ಇದ್ದರೆ, ಹುಡುಕಾಟ ಪೆಟ್ಟಿಗೆ
- ಉಳಿದ ಸೈಟ್ನಂತೆಯೇ ಅದೇ ಹೆಡರ್ ಮತ್ತು ನ್ಯಾವಿಗೇಷನ್
ನಿಮ್ಮ ಸೆಟಪ್ ಅನುಮತಿಸುವಲ್ಲಿ, ಅಸ್ತಿತ್ವದಲ್ಲಿಲ್ಲದ ಪುಟಗಳಿಗೆ ನಿಜವಾದ 404 ಸ್ಥಿತಿ ಹಿಂತಿರುಗಿಸಿ. 200 ಸ್ಥಿತಿಯೊಂದಿಗೆ ಹಿಂತಿರುಗಿದ "not found" ಸಂದೇಶವನ್ನು ಸರ್ಚ್ ಎಂಜಿನ್ಗಳು ಸಾಫ್ಟ್ 404 ಎಂದು ಕರೆಯುತ್ತವೆ, ಮತ್ತು ಅದು ಅವುಗಳ ಕ್ರಾಲ್ ಸಮಯವನ್ನು ವ್ಯರ್ಥ ಮಾಡಬಹುದು ಮತ್ತು ಇಂಡೆಕ್ಸಿಂಗ್ ಅನ್ನು ಗೊಂದಲಗೊಳಿಸಬಹುದು.
ಸಾಮಾನ್ಯ ತಪ್ಪುಗಳು
- ಕ್ಲಿಕ್ ಮಾಡಿ ಮಾತ್ರ ಪರೀಕ್ಷಿಸುವುದು. ಯಾವಾಗಲೂ ಆಳವಾದ URLಗಳನ್ನು ಹೊಸ ಟ್ಯಾಬ್ಗೆ ಅಂಟಿಸಿ ರಿಫ್ರೆಶ್ ಮಾಡಿ ಪರೀಕ್ಷಿಸಿ.
- ಎಲ್ಲವನ್ನೂ ಹಿಡಿಯುವ ಫಾಲ್ಬ್ಯಾಕ್. ಅಸೆಟ್ಗಳು ಮತ್ತು API ರೂಟ್ಗಳು
index.htmlಹಿಂತಿರುಗಿಸಿದರೆ ಖಾಲಿ ಪುಟಗಳು ಮತ್ತು ಗೊಂದಲಕಾರಿ API ದೋಷಗಳು ಬರುತ್ತವೆ. - ಸರ್ವರ್ನಲ್ಲಿ ಮಾತ್ರ ಮುರಿಯುವ ದೊಡ್ಡ-ಸಣ್ಣ ಅಕ್ಷರ ವ್ಯತ್ಯಾಸ.
- ಬಿಲ್ಡ್ ಔಟ್ಪುಟ್ ಬದಲು ಸೋರ್ಸ್ ಫೋಲ್ಡರ್ ಡಿಪ್ಲಾಯ್ ಮಾಡುವುದು.
- ರೀಡೈರೆಕ್ಟ್ ಇಲ್ಲದೆ URLಗಳನ್ನು ಪುನರ್ರಚಿಸುವುದು. ಪ್ರತಿ ಹಳೆಯ ಲಿಂಕ್ 404 ಆಗುತ್ತದೆ.
Mythex ನಲ್ಲಿ 404ಗಳು
Mythex ನಲ್ಲಿ ನೀವು ವರ್ಕ್ಸ್ಪೇಸ್ನಿಂದ ಪ್ರಕಟಿಸುತ್ತೀರಿ, ಮತ್ತು ಸ್ಥಿರ ಫ್ರಂಟ್ಎಂಡ್ಗಳು ಸ್ಥಿರ ಸೈಟ್ಗಳಾಗಿ ಡಿಪ್ಲಾಯ್ ಆಗುತ್ತವೆ. ಪ್ರಕಟಿತ ಪುಟ 404 ತೋರಿಸಿದರೆ, ಏಜೆಂಟ್ಗೆ ನಿಖರ URL ನೀಡಿ, ರಿಫ್ರೆಶ್ ಮಾಡಿದಾಗ ಅಥವಾ ಕ್ಲಿಕ್ ಮಾಡಿದಾಗ ಸಂಭವಿಸುತ್ತಿದೆಯೇ ಹೇಳಿ, Network ಟ್ಯಾಬ್ ಏನು ತೋರಿಸುತ್ತದೆ ಎಂದು ತಿಳಿಸಿ, ಮತ್ತು ರೂಟಿಂಗ್ ಪರಿಶೀಲಿಸಲು ಕೇಳಿ. ಪ್ರಕಟಿತ ಆಪ್ ನೀವು ಮರು-ಪ್ರಕಟಿಸುವವರೆಗೆ ಒಂದು ಸ್ನ್ಯಾಪ್ಶಾಟ್ ಆಗಿರುವುದರಿಂದ, ಸರಿಪಡಿಸಿದ ನಂತರ ಮತ್ತೆ ಪ್ರಕಟಿಸಿ. ಇತ್ತೀಚೆಗೆ ಪ್ರಾಜೆಕ್ಟ್ ಬದಲಿಸಿ ಲೈವ್ ಸೈಟ್ ಹಳೆಯದಾಗಿ ಕಂಡರೆ, ಮತ್ತೆ ಪ್ರಕಟಿಸಿ ಮತ್ತು hard refresh ಮಾಡಿ. ಬಿಲ್ಡ್ ವಿಫಲವಾದರೆ ಪ್ರಕಟಣೆ ಸಂವಾದದಲ್ಲಿ Fix with AI ಬಳಸಿ. ನೋಡಿ ಪ್ರಕಟಿಸುವುದು ಹೇಗೆ ಮತ್ತು Publish troubleshooting ಡಾಕ್ಸ್ನಲ್ಲಿ, ಮತ್ತು AI ನಿರ್ಮಿತ ಆಪ್ ಅನ್ನು ಡೀಬಗ್ ಮಾಡುವುದು ಮಾರ್ಗದರ್ಶಿ.
404 ಪರಿಶೀಲನಾ ಪಟ್ಟಿ
- ಯಾವ URLಗಳು 404 ಆಗುತ್ತವೆ ಮತ್ತು ಕ್ಲಿಕ್, ರಿಫ್ರೆಶ್ ಅಥವಾ ಎರಡರಲ್ಲೂ ಎಂದು ಗಮನಿಸಿದೆ
- SPA ಫಾಲ್ಬ್ಯಾಕ್ ಆಪ್ ರೂಟ್ಗಳಿಗೆ 200 ಸ್ಥಿತಿಯೊಂದಿಗೆ
index.htmlನೀಡುತ್ತದೆ - ಫಾಲ್ಬ್ಯಾಕ್ ನಿಜವಾದ ಫೈಲ್ಗಳು ಮತ್ತು
/api/*ಅನ್ನು ಹೊರಗಿಡುತ್ತದೆ - ರೂಟರ್ನಲ್ಲಿ ಕ್ಯಾಚ್-ಆಲ್ "not found" ರೂಟ್ ಇದೆ
- ಬಿಲ್ಡ್ ಔಟ್ಪುಟ್ ಫೋಲ್ಡರ್ ಪ್ರಕಟವಾಗುತ್ತದೆ, ಮತ್ತು ಬಿಲ್ಡ್ ಯಶಸ್ವಿಯಾಗಿದೆ
- Base path ಆಪ್ ಸರ್ವ್ ಆಗುವ ಸ್ಥಳಕ್ಕೆ ಹೊಂದುತ್ತದೆ
- ಫೈಲ್ ಹೆಸರಿನ ಅಕ್ಷರ ಬಳಕೆ ಪ್ರತಿ ಉಲ್ಲೇಖಕ್ಕೆ ಹೊಂದುತ್ತದೆ
- ಅಸೆಟ್ ಮಾರ್ಗಗಳು
/ನಿಂದ ಆರಂಭವಾಗುತ್ತವೆ - ಕೊನೆಯ ಸ್ಲ್ಯಾಷ್ ಶೈಲಿ ಸ್ಥಿರವಾಗಿದೆ
- API ರೂಟ್ಗಳು ಡಿಪ್ಲಾಯ್ ಆಗಿವೆ ಮತ್ತು ಪ್ರೊಡಕ್ಷನ್ನಲ್ಲಿ ರೂಟ್ ಆಗಿವೆ
- ಹಳೆಯ URLಗಳಿಗೆ 301 ರೀಡೈರೆಕ್ಟ್ಗಳಿವೆ
- ಆಳವಾದ ಲಿಂಕ್ಗಳನ್ನು ಹೊಸ ಟ್ಯಾಬ್ಗೆ ಅಂಟಿಸಿ ಪರೀಕ್ಷಿಸಲಾಗಿದೆ
ಪ್ರಶ್ನೆಗಳು
ನನ್ನ React ಆಪ್ನಲ್ಲಿ ಪುಟವನ್ನು ರಿಫ್ರೆಶ್ ಮಾಡಿದಾಗ 404 ಏಕೆ ಬರುತ್ತದೆ?
ಸಿಂಗಲ್-ಪೇಜ್ ಆಪ್ನಲ್ಲಿ `/dashboard` ನಂತಹ ರೂಟ್ಗಳು JavaScript ನಲ್ಲಿ ಮಾತ್ರ ಅಸ್ತಿತ್ವದಲ್ಲಿರುತ್ತವೆ. ಲಿಂಕ್ ಕ್ಲಿಕ್ ಮಾಡಿದರೆ ರೂಟರ್ ಅದನ್ನು ಬ್ರೌಸರ್ನಲ್ಲೇ ನಿರ್ವಹಿಸುವುದರಿಂದ ಕೆಲಸ ಮಾಡುತ್ತದೆ, ಆದರೆ ರಿಫ್ರೆಶ್ ಮಾಡಿದಾಗ ಸರ್ವರ್ನಿಂದ `/dashboard` ಫೈಲ್ ಕೇಳಲಾಗುತ್ತದೆ, ಅದು ಇರುವುದಿಲ್ಲ. ಪರಿಹಾರ: ಆಪ್ ರೂಟ್ಗಳಿಗೆ `index.html` ನೀಡುವ ಫಾಲ್ಬ್ಯಾಕ್ ನಿಯಮ.
Netlify, Vercel ಅಥವಾ Nginx ನಲ್ಲಿ SPA ಫಾಲ್ಬ್ಯಾಕ್ ಹೇಗೆ ಸೇರಿಸುವುದು?
Netlify ನಲ್ಲಿ `/* /index.html 200` ಇರುವ `_redirects` ಫೈಲ್ ಸೇರಿಸಿ. Vercel ನಲ್ಲಿ `vercel.json` ನಲ್ಲಿ ಎಲ್ಲಾ ಮಾರ್ಗಗಳನ್ನು `/index.html` ಗೆ ಕಳುಹಿಸುವ rewrite ಸೇರಿಸಿ. Nginx ನಲ್ಲಿ location ಬ್ಲಾಕ್ನಲ್ಲಿ `try_files $uri $uri/ /index.html;` ಬಳಸಿ. ನಿಯಮಗಳು ಬದಲಾಗುವುದರಿಂದ ನಿಮ್ಮ ಹೋಸ್ಟ್ನ ಡಾಕ್ಸ್ ಪರಿಶೀಲಿಸಿ.
ಡಿಪ್ಲಾಯ್ ನಂತರ ನನ್ನ ಚಿತ್ರಗಳು ಅಥವಾ ಫೈಲ್ಗಳು 404 ಏಕೆ ತೋರಿಸುತ್ತವೆ?
ಸಾಮಾನ್ಯವಾಗಿ ಫೈಲ್ ಬಿಲ್ಡ್ ಔಟ್ಪುಟ್ನಲ್ಲಿ ಇರುವುದಿಲ್ಲ, ಅಥವಾ ಮಾರ್ಗದ ದೊಡ್ಡ-ಸಣ್ಣ ಅಕ್ಷರಗಳು ಹೊಂದುವುದಿಲ್ಲ (ನಿಮ್ಮ ಲ್ಯಾಪ್ಟಾಪ್ ಕ್ಷಮಿಸುವ ಕಡೆ ಸರ್ವರ್ಗಳು ಹೆಚ್ಚಾಗಿ ಕೇಸ್-ಸೆನ್ಸಿಟಿವ್ ಆಗಿರುತ್ತವೆ), ಅಥವಾ ಮಾರ್ಗ ಸ್ಲ್ಯಾಷ್ನಿಂದ ಆರಂಭವಾಗಬೇಕಿದ್ದಾಗ ಸಾಪೇಕ್ಷವಾಗಿದೆ.
ಕಾಣೆಯಾದ ಪುಟ ನೈಜ 404 ಸ್ಥಿತಿ ಹಿಂತಿರುಗಿಸಬೇಕೇ?
ಹೌದು. ಸಹಾಯಕವಾದ not-found ಪುಟ ತೋರಿಸಿ, ಆದರೆ ನಿಮ್ಮ ಸೆಟಪ್ ಅನುಮತಿಸುವಲ್ಲಿ 404 ಸ್ಥಿತಿಯೊಂದಿಗೆ. 'Not found' ಸಂದೇಶ 200 ಸ್ಥಿತಿಯೊಂದಿಗೆ ಬಂದರೆ ಸರ್ಚ್ ಎಂಜಿನ್ಗಳು ಅದನ್ನು ಸಾಫ್ಟ್ 404 ಎಂದು ಪರಿಗಣಿಸುತ್ತವೆ; ಇದು ಕ್ರಾಲ್ ಸಮಯವನ್ನು ವ್ಯರ್ಥ ಮಾಡುತ್ತದೆ ಮತ್ತು ಇಂಡೆಕ್ಸಿಂಗ್ ಗೊಂದಲಕ್ಕೆ ಕಾರಣವಾಗಬಹುದು.