ઉકેલાયેલ: પ્રતિક્રિયા રાઉટર 404 રીડાયરેક્ટ

રીએક્ટ રાઉટર 404 રીડાયરેક્ટથી સંબંધિત મુખ્ય સમસ્યા એ છે કે તેને અમલમાં મૂકવું મુશ્કેલ હોઈ શકે છે. રિએક્ટ રાઉટરમાં બિલ્ટ-ઇન 404 પૃષ્ઠ ન હોવાથી, વિકાસકર્તાઓએ 404 પૃષ્ઠ માટે મેન્યુઅલી એક રૂટ બનાવવો જોઈએ અને પછી હાલના રૂટ સાથે મેળ ખાતી ન હોય તેવી કોઈપણ વિનંતીઓને રીડાયરેક્ટ કરવા માટે રાઉટરને ગોઠવવું જોઈએ. આને વધારાના કોડ અને રૂપરેખાંકનની જરૂર છે, જે સમય માંગી શકે છે અને જો કંઈક ખોટું થાય તો ડીબગ કરવું મુશ્કેલ હોઈ શકે છે. વધુમાં, જો વપરાશકર્તા સીધા જ એવા URL પર નેવિગેટ કરે છે જે અસ્તિત્વમાં નથી, તો પણ તેઓ 404 પૃષ્ઠ પર રીડાયરેક્ટ થવાને બદલે એક ભૂલ પૃષ્ઠ જોશે.

import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

const App = () => (
  <Router>
    <Switch>
      <Route exact path="/" component={Home} />
      <Route exact path="/about" component={About} />

      {/* 404 Redirect */}
      <Route render={() => (<Redirect to="/" />)} /> 

    </Switch>
  </Router>  
);

// લાઇન 1: આ લાઇન બ્રાઉઝર રાઉટર, રૂટ અને સ્વિચ ઘટકોને પ્રતિક્રિયા-રાઉટર-ડોમ લાઇબ્રેરીમાંથી આયાત કરે છે.

// લાઇન 3: આ લાઇન એપ નામના ફંક્શનને વ્યાખ્યાયિત કરે છે જે JSX પરત કરે છે.

// રેખાઓ 5-7: આ રેખાઓ એપ ઘટકને રાઉટર ઘટકમાં પ્રતિક્રિયા-રાઉટર-ડોમથી લપેટી છે.

// રેખાઓ 8-10: આ રેખાઓ અનુક્રમે હોમ અને અબાઉટ ઘટકો માટે બે માર્ગો વ્યાખ્યાયિત કરે છે.

// લાઇન 12: આ લાઇન એવા રૂટને વ્યાખ્યાયિત કરે છે જે હોમ પેજ પર રીડાયરેક્ટ કરે છે જો અન્ય કોઈ રૂટ મેળ ખાતો નથી.

404 એરર કોડ શું છે

રિએક્ટ રાઉટરમાં 404 એરર કોડ એ HTTP સ્ટેટસ કોડ છે જે સૂચવે છે કે વિનંતી કરેલ સંસાધન શોધી શકાયું નથી. તે સામાન્ય રીતે પાછું આવે છે જ્યારે વપરાશકર્તા કોઈ પૃષ્ઠ અથવા રૂટને ઍક્સેસ કરવાનો પ્રયાસ કરે છે જે અસ્તિત્વમાં નથી. જો વપરાશકર્તાએ URL ને ખોટી રીતે ટાઇપ કર્યું હોય, અથવા જો પૃષ્ઠને તેની લિંક્સ અપડેટ કર્યા વિના દૂર કરવામાં અથવા ખસેડવામાં આવ્યું હોય તો આ થઈ શકે છે. જ્યારે આવું થાય છે, ત્યારે રિએક્ટ રાઉટર વપરાશકર્તાને તેમની ભૂલની જાણ કરતા યોગ્ય સંદેશ સાથે સામાન્ય 404 પૃષ્ઠ પ્રદર્શિત કરશે.

404 રીડાયરેક્ટ

રિએક્ટ રાઉટરમાં, 404 રીડાયરેક્ટ એ વપરાશકર્તાઓને અમાન્ય URL ને ઍક્સેસ કરવાનો પ્રયાસ કરતી વખતે એક અલગ પૃષ્ઠ પર રીડાયરેક્ટ કરવાની રીત છે. જ્યારે તેઓ ખોટો URL દાખલ કરે અથવા અસ્તિત્વમાં ન હોય તેવા પૃષ્ઠને ઍક્સેસ કરવાનો પ્રયાસ કરે ત્યારે વપરાશકર્તાઓને વધુ સારો અનુભવ આપવા માટે આ ઉપયોગી થઈ શકે છે. 404 રીડાયરેક્ટને રીએક્ટ રાઉટરમાંથી રીડાયરેક્ટ ઘટકનો ઉપયોગ કરીને અમલમાં મૂકી શકાય છે, જે તમને વપરાશકર્તાને જે પૃષ્ઠ પર રીડાયરેક્ટ કરવા માંગો છો તેના પાથનામનો ઉલ્લેખ કરવાની મંજૂરી આપે છે. ઉદાહરણ તરીકે, જો કોઈ વ્યક્તિ /invalid-url ને ઍક્સેસ કરવાનો પ્રયાસ કરે છે, તો તમે આના જેવા રીડાયરેક્ટ ઘટકનો ઉપયોગ કરી શકો છો: