innoway
05 iyun 2024

React Single Page Application (SPA) Routing

     Müasir veb tətbiqi inkişafı getdikcə daha çox Single Page Application (SPA) yanaşmasını qəbul edir. React, Vue və Angular kimi məşhur JavaScript çərçivələri bu metodu dəstəkləyir və bu, veb tətbiqlərinin sürətinə və cavabdehliyinə töhfə verir. Bununla belə, SPA-ların gətirdiyi çoxsaylı üstünlüklərlə yanaşı, bəzi ümumi yerləşdirmə və yönləndirmə problemləri də mövcuddur. Xüsusilə, SPA-nı istehsalata yerləşdirdikdən sonra tez-tez rast gəlinən bir problem URL-lər vasitəsilə birbaşa giriş zamanı istifadəçinin boş səhifə ilə üzləşməsidir. Bunun əsas səbəbi serverin spesifik URL-ə uyğun fiziki faylı axtarması və onu tapa bilməməsidir. Bu, SPA-ların təbiətinə xasdır, çünki bütün məzmun tək index.html faylından təmin edilir.
     Bu məqalədə biz bu ümumi problemin necə həll olunacağını və React SPA-nı müxtəlif server növlərində necə yerləşdirəcəyinizi müzakirə edəcəyik.

React SPA Yönləndirmə Problemlərinin Həlli

IIS ilə React üçün:
     Əgər React tətbiqinizi IIS üzərində yerləşdirirsinizsə, URL yenidən yazılması üçün web.config faylında aşağıdakı konfiqurasiyadan istifadə edə bilərsiniz:

<configuration>

  <system.webServer>

    <rewrite>

      <rules>

        <rule name="React Routes" stopProcessing="true">

          <match url=".*" />

          <conditions logicalGrouping="MatchAll">

            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />

            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />

          </conditions>

          <action type="Rewrite" url="/index.html" />

        </rule>

      </rules>

    </rewrite>

  </system.webServer>

</configuration>




innoway