description

اجرای reactJS در هاست

- 4 ماه پیش
توسط Amin Khademian آپدیت شد
محمد مهدی صادقی ( 192 تجربه )
4 ماه پیش

سلام. من پروژه ی build شده ی خودم رو در هاست ویندوزی website panel آپلود کردم، وبا زدن آدرس دامنه، درست میاره. لینک های داخلی هم مثل signIn و ... با کلیک بر روی اونا، درست میاره. ولی متاسفانه اگر در صفحه ی داخلی مثل signIn باشیم و صفحه رو رفرش کنیم، ارور ۴۰۴ - File or directory not found.
The resource you are looking for might have been removed, had its name changed, or is temporarily unavailable.
رو نشون میده. کلا اگر به طور مستقیم url داخلی رو وارد کنیم، این ارور میاد. مثلا : www.siteName.ir/signIn

بهترین پاسخ انتخاب شده توسط محمد مهدی صادقی

ممنون از شما ashkana و آقای موسوی. این راهی که گفتید، مال سرور لینوکس هستش و فایل .htaccess روی ویندوز فک نکنم عملکردی داشته باشه.

خیلی گشتم تا مشکل رو حل کردم. همون تنظیمات رو باید توی فایل web.config انجام بشه:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <!-- This part is responsible for URL rewrites -->
        <rewrite>
          <rules>
            <rule name="ReactJS Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
              </conditions>
              <action type="Rewrite" url="/" />
            </rule>
          </rules>
        </rewrite>
        <!-- This allows CORS for testing purposes -->
        <httpProtocol>
         <customHeaders>
           <add name="Access-Control-Allow-Origin" value="*" />
         </customHeaders>
       </httpProtocol>
  </system.webServer>
</configuration>

ضمنا حتما باید افزونه ی url-rewrite روی سرور نصب باشه. مال من بدون اون ارور میداد. لینکش رو میذارم:
https://www.iis.net/downloads/microsoft/url-rewrite

حسام موسوی ( 62306 تجربه )
4 ماه پیش

باید htaccess رو تغییر بدید تا اگر کاربر روت دیگه ای رو فراخونی میکنه همون روت اصلی برای شما بیاد و ادرسش همون باشه تا reactjs بتونه اون رو بگیره و handle کنه

محمد مهدی صادقی ( 192 تجربه )
4 ماه پیش

ببخشید میشه بگید باید چه کار کنم؟ سرویس من vps هست و سیستم عاملش windows server 2012 هستش.
اصلا htaccess برای ویندوز هم هست؟

اشکان اهرابی ( 729 تجربه )
4 ماه پیش

سلام، این مشکل از اینجاست که شما وقتی یک single page application دارید درواقع فقط یک فایل html به نام index دارید. زمانیکه وارد اپلیکیشن خودتون میشید و وارد روت‌های مختلف می‌شید اپلیکیشن کاملا درست و بدون مشکل کار می‌کنه. اما به محض این که یک صفحه را رفرش کنید مثلا همون singIn رو، اونوقت درخواستی که به سرور ارسال میشه بهش میگه برو دنبال فایل signIn.html که درواقع همچین فایلی روی سرور وجود نداره و اون روت signIn یک روت در داخل اپلیکیشن شماست.
همونطور که آقای موسوی فرمودن باید با تغییر دادن فایل .htaccess رو سرور خودتون این مشکل رو برطرف کنید. روی سرورتون دقیقا کنار index.html یک فایل htaccess. بسازید (توجه کنید که حتما دات رو قرار بدید قبل از اسم htaccess ) و تنظیمات زیر رو داخلش کپی کنید و ذخیره‌اش کنید.

بعد که وارد سایت بشید بدون هیچ مشکلی میتونید رفرش کنید هر صفحه رو و کاملا درست صفحه رفرش میشه.

Options -MultiViews
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.html [QSA,L]
محمد مهدی صادقی ( 192 تجربه )
4 ماه پیش

ممنون از شما ashkana و آقای موسوی. این راهی که گفتید، مال سرور لینوکس هستش و فایل .htaccess روی ویندوز فک نکنم عملکردی داشته باشه.

خیلی گشتم تا مشکل رو حل کردم. همون تنظیمات رو باید توی فایل web.config انجام بشه:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <!-- This part is responsible for URL rewrites -->
        <rewrite>
          <rules>
            <rule name="ReactJS Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
              </conditions>
              <action type="Rewrite" url="/" />
            </rule>
          </rules>
        </rewrite>
        <!-- This allows CORS for testing purposes -->
        <httpProtocol>
         <customHeaders>
           <add name="Access-Control-Allow-Origin" value="*" />
         </customHeaders>
       </httpProtocol>
  </system.webServer>
</configuration>

ضمنا حتما باید افزونه ی url-rewrite روی سرور نصب باشه. مال من بدون اون ارور میداد. لینکش رو میذارم:
https://www.iis.net/downloads/microsoft/url-rewrite

Amin Khademian ( 853 تجربه )
4 ماه پیش

این راه حل ها فقط کار میکنن اما راه درستی نیست پس فردا اپ رو روی یه سرو دیگه بخوای اجرا کنی دوباره باید همین کارارو انجام بدی و با express توی خود اپ میتونی این کار رو هندل کنی یه بار برای همیشه سعی کن همیشه بهترین راه رو پیدا کنی نه راهی که فقط کار میکنه

برای ارسال پاسخ باید وارد سایت شوید