কৌণিক 2.0 রাউটার ব্রাউজারটি পুনরায় লোড করার জন্য কাজ করছে না


190

আমি কৌনিক 2.0.0-alpha.30 সংস্করণ ব্যবহার করছি। যখন কোনও অন্য রুটে পুনঃনির্দেশ করা হয়, তারপরে ব্রাউজারটি রিফ্রেশ করুন, এটি জিইটি / রুটটি দেখাচ্ছে না।

এই ত্রুটিটি কেন ঘটেছে তা অনুধাবন করতে আপনি আমাকে সহায়তা করতে পারেন?



উত্তরের জন্য ধন্যবাদ তবে এটি একটি কৌণিক 1.x সংস্করণের জন্য। আমি কৌনিক 2.0 তে ইস্যুটির মুখোমুখি।
ভিনজ এবং টনজ

1
লিঙ্কযুক্ত প্রশ্নটি পুশস্টেটের সাথে কৌনিক নির্দিষ্ট নয় এমন একটি সাধারণ সমস্যা। আপনার প্রশ্নটি সম্পর্কিত কিনা তা জানতে যথেষ্ট তথ্য সরবরাহ করে না।
গন্টার জ্যাচবাউর

5
কৌণিক 2.0 একটি সম্পূর্ণ নতুন রাউটার ব্যবহার করে তাই লিঙ্কযুক্ত পোস্টটি এখন পুরানো রাউটারের কোনও উপযোগী নয়
ভিন্জ এবং টনজ

যেমন আমি বলেছি এটি যদি পুশস্টেট সমস্যা হয় তবে এটি কৌণিক নির্দিষ্ট নয় এবং কৌণিক দ্বারা স্থির করা যাবে না তবে পরিবর্তে সার্ভারে স্থির করা দরকার।
গন্টার জ্যাচবাউর

উত্তর:


141

আপনি যে ত্রুটিটি দেখছেন তা হ'ল আপনি http: // লোকালহোস্ট / রুটটির অনুরোধ করছেন যা বিদ্যমান নেই। সাইমন মতে ।

এইচটিএমএল 5 রাউটিং ব্যবহার করার সময় আপনার অ্যাপ্লিকেশানের সমস্ত রুট (বর্তমানে 404) আপনার সার্ভারের দিকের সূচক। আপনার জন্য এখানে কিছু বিকল্প রয়েছে:

  1. লাইভ-সার্ভার ব্যবহার করে: https://www.npmjs.com/package/live-server

    $live-server --entry-file=index.html`
    
  2. nginx: http://nginx.org/en/docs/beginners_guide.html ব্যবহার করে

    error_page 404 /index.html
    
  3. টমকাট - ওয়েব.এক্সএমএল কনফিগারেশন। থেকে Kunín এর মন্তব্যে

    <error-page>
          <error-code>404</error-code>
          <location>/index.html</location>
    </error-page>
    

1
যেহেতু একজনের এইচটিএমএল 5 রাউটিংয়ের জন্য সার্ভার সাইড সমর্থন প্রয়োজন এটি পুরোপুরি ভালভাবে কাজ করে। থ্যাঙ্কস
প্রভাত

আমি কি প্রক্সি হিসাবে nginx ব্যবহার করতে পারি pub serve? এইভাবে pub buildউন্নয়নের সময় আমার খুব বেশি দরকার নেই । আমি চেষ্টা করেছি কিন্তু proxy_passখুব ভাল কাজ করে না error_page
ফ্রাঙ্কলিন ইউ

@ ফ্র্যাঙ্কলিনইউ আমি এর আগে করিনি। আপনি কি তা সমাধান করেছেন?
কিয় তাং

1
এনজিনেক্স ব্যবহার করা হচ্ছে। , অ্যাপ্লিকেশানের লোকেশনে ত্রুটি_সীমা 404 /index.html আমার জন্য কাজ করেছিল। ধন্যবাদ.
রিচার্ড কে। ক্যাম্পিয়ন

2
টমক্যাট - ওয়েব.এক্সএমএল <error-page> <error-code> 404 </error-code> <location> /index.html </location> </error-page>
এ কুনিন

65

দাবি অস্বীকার: এই ফিক্সটি আলফা 44 এর সাথে কাজ করে

আমার একই সমস্যা ছিল এবং Angular.io এপিআই পূর্বরূপে তালিকাভুক্ত হ্যাশলোকেশনস্ট্রেজি প্রয়োগ করে এটি সমাধান করেছি ।

https://angular.io/docs/ts/latest/api/common/index/HashLocationStrategy-class.html

প্রয়োজনীয় নির্দেশাবলী আমদানি করে শুরু করুন

import {provide} from 'angular2/angular2';
import {
  ROUTER_PROVIDERS,
  LocationStrategy,
  HashLocationStrategy
} from 'angular2/router';

এবং অবশেষে, এটির মতো বুটস্ট্র্যাপ করুন

bootstrap(AppCmp, [
  ROUTER_PROVIDERS,
  provide(LocationStrategy, {useClass: HashLocationStrategy})
]);

আপনার রুটটি http: // লোকালহোস্ট / # / রুট হিসাবে উপস্থিত হবে এবং আপনি রিফ্রেশ করার পরে এটি উপযুক্ত জায়গায় পুনরায় লোড হবে।

আশা করি এইটি কাজ করবে!


1
এই কোডটি সূক্ষ্মভাবে কাজ করবে তবে এই কৌশলটিতে কিছু প্রবলেম রয়েছে এটি ব্যবহার #করে ইউআরএলে স্বয়ংক্রিয় যুক্ত হবে। এটি ব্যবহার করে URL টি থেকে # সরানোর কোনও সমাধান আছে কি?
পারদীপ জৈন

সম্মত, আমি এখানে তালিকাভুক্ত "প্যাথলোকেশনস্ট্রজি" প্রয়োগ করার চেষ্টা করেছি , কিন্তু এটি কাজ করতে পারেনি। ছাড়া একটি ইউআরএল #অনুকূল হবে।
সাইমনহাউজ

হ্যাঁ আমিও একই সাথে চেষ্টা করেছিলাম PathLocationStrategyকিন্তু এটি আমার পক্ষে কাজ করছে না। হয় আমি ভুল পদ্ধতি ব্যবহার করেছি অথবা পাথলোকেশনস্ট্রেজি কীভাবে ব্যবহার করতে হয় তা আমি জানি না।
পারদীপ জৈন

1
এটি আরসি 1 এ আমার পক্ষে কাজ করে না। '@ কৌণিক / রাউটার' থেকে লোকেশনস্ট্রেজি, হ্যাশলোকেশনস্ট্রেজি আমদানি ব্যর্থ।
ইনফোজল্ট

1
1 বছরেরও বেশি সময় পরে এই প্রশ্নে ফিরে আসার জন্য দুঃখিত :) তবে কি হ্যাশলোকেশনস্ট্রেজি একই রাউটারের পথে থাকতে সহায়তা করে? আমার ক্ষেত্রে যখন আমি রিফ্রেশ করি তখন তা আমাকে লোকালহোস্ট / # / <ডিফল্ট রুটে> যেমন হোম পৃষ্ঠার জন্য ডিফল্ট রুটে নিয়ে যায়। আমি 'রিফ্রেশ' করার সময় আমি যে মূল রুটে ছিলাম সেখানে আমি কীভাবে যেতে পারি?
রাজুগাদু

47

কৌনিকটি ডিফল্টরূপে HTML5 পুশস্টেট ব্যবহার করে ( PathLocationStrategyকৌণিক স্ল্যাংয়ে )।
আপনার একটি হয় এমন সার্ভারের প্রয়োজন যা এটির অনুরোধ মতো সমস্ত অনুরোধগুলি প্রক্রিয়া করে index.htmlবা আপনি HashLocationStrategy(রুটের জন্য URL এ # দিয়ে) https://angular.io/docs/ts/latest/api/common/index/HashLocationStrategy-class স্যুইচ করেন । এইচটিএমএল

আরো দেখুন Https://ngmilk.rocks/2015/03/09/angularjs-html5-mode-or- ব্যাখ্যাty-urls- using-

HashLocationStrategyব্যবহারে স্যুইচ করতে

> = আরসি.5 এবং 2.0.0 ফাইনালের জন্য আপডেট

import {HashLocationStrategy, LocationStrategy} from '@angular/common';

@NgModule({
  declarations: [AppCmp], 
  bootstrap: [AppCmp],
  imports: [BrowserModule, routes],
  providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}]
]);

বা এর সাথে সংক্ষিপ্ত useHash

imports: [RouterModule.forRoot(ROUTER_CONFIG, {useHash: true}), ...

আপনার প্রয়োজনীয় সমস্ত আমদানি রয়েছে তা নিশ্চিত করুন

নতুন (আরসি.3) রাউটারের জন্য

<base href="."> 

404 পাশাপাশি হতে পারে।

এটি পরিবর্তে প্রয়োজন

<base href="/">

> = আরসি.এক্স

bootstrap(AppCmp, [
  ROUTER_PROVIDERS,
  provide(LocationStrategy, {useClass: HashLocationStrategy})
  // or since RC.2
  {provide: LocationStrategy, useClass: HashLocationStrategy} 
]);

import {provide} from '@angular/core';
import {  
  PlatformLocation,  
  Location,  
  LocationStrategy,  
  HashLocationStrategy,  
  PathLocationStrategy,  
  APP_BASE_HREF}  
from '@angular/common';  

> বিটা ১ for এর জন্য আপডেট করুন আমদানি পরিবর্তন হয়েছে

import {BrowserPlatformLocation} from '@angular/platform-browser';

import {provide} from 'angular2/core';
import {
  // PlatformLocation,
  // Location,
  LocationStrategy,
  HashLocationStrategy,
  // PathLocationStrategy,
  APP_BASE_HREF}
from 'angular2/router';
import {BrowserPlatformLocation} from 'angular2/src/router/location/browser_platform_location';

<বিটা .১6

import {provide} from 'angular2/core';
import {
  HashLocationStrategy
  LocationStrategy,
  ROUTER_PROVIDERS,
} from 'angular2/router';

আরও দেখুন https://github.com/angular/angular/blob/master/CHANGELOG.md#200-beta16-2016-04-26 ব্রেকিং-পরিবর্তন


1
ধন্যবাদ! সরবরাহটি কৌণিক / মূলের অধীনে চলে গেছে বলে মনে হচ্ছে: 'কৌণিক 2 / কোর' থেকে আমদানি করুন {সরবরাহ
স্ট্রেনজলুপ

1
কেবলমাত্র লক্ষণীয়: update for >= RC.x(আরসি ২) এর সাথে কাজ করে router 3.0.0-alpha.7তবে provideকোন ক্রিয়াকলাপটি এটি প্রতিস্থাপন করেছে সে সম্পর্কে তথ্য ছাড়াই অবহেলা হিসাবে টিকা দেওয়া হয়েছে।
মিস্টারফুল

ব্যবহার{provide: SomeClass, useClass: OtherClass}
Günter Zöchbauer

2
সর্বাধিক আপডেট উত্তর। কৌনিক 2.4.1 এর সর্বশেষতম সংস্করণের জন্য আমার কাছে <বেস href = "./"> ছিল। <বেস href = "/"> এ পরিবর্তিত আমার সমস্যাটি সমাধান করেছে। কারও জন্য সহায়ক হতে পারে।
সাইয়্যাফ ফারুক

28

আমি মনে করি আপনি যে ত্রুটিটি দেখছেন তা হ'ল কারণ আপনি http: // লোকালহোস্ট / রুটটির অনুরোধ করছেন যা বিদ্যমান নেই। আপনাকে নিশ্চিত করতে হবে যে আপনার সার্ভারটি সমস্ত অনুরোধগুলি আপনার মূল সূচক html পৃষ্ঠায় মানচিত্র করবে।

অ্যাঙ্গুলার 2 ইউআরএল শেষে হ্যাশ ব্যবহার না করে ডিফল্টরূপে এইচটিএমএল 5 রাউটিং ব্যবহার করে, পৃষ্ঠাটি রিফ্রেশ করে অন্য উত্সের অনুরোধের মতো দেখায়।


7
তাহলে আমরা কীভাবে এটি ঠিক করব? আমরা কীভাবে সমস্ত অনুরোধগুলি ডিফল্টরূপে মূল সূচকে ম্যাপ করব? এটি কি সার্ভার নির্ভর?
আয়শ

1
হ্যাঁ, আপনি যা যা ওয়েব ফ্রেম ফ্রেম ব্যবহার করছেন তা দিয়ে আপনি সার্ভারে এটি করবেন। বিকল্পটি হ্যাশলোকেশনস্ট্রেজিটি নীচে বর্ণিত হিসাবে ব্যবহার করা।
সাইমন

আপনি উপস্থিত নেই প্রতিটি রুটে কৌনিক এসপিএ পুনরায় লোড করা হবে। এটি কীভাবে পরিচালনা করা উচিত?
গ্যারি

এটি কেবল তখনই লোড হয় যখন ব্যবহারকারী ব্রাউজারে রিফ্রেশ ক্লিক করে, যখন ইউআইয়ের মাধ্যমে রুট পরিবর্তন করে। ব্যবহারকারী রিফ্রেশ করার সময় কোনও পুনরায় লোডের চারপাশে আসলেই হয় না।
ওয়ালেস হাওয়ারি 21

19

আপনি যদি ডিফল্ট এইচটিএমএল অবস্থান কৌশল ব্যবহার করেন তবে সমস্ত রাউটার সংস্করণে এটি একটি সাধারণ পরিস্থিতি।

যা হয় তা হ'ল ব্রাউজার বারের URL টি একটি সম্পূর্ণ পূর্ণ এইচটিএমএল url, উদাহরণস্বরূপ: http://localhost/route

সুতরাং যখন আমরা ব্রাউজার বারে এন্টার টিপুন, তখন একটি প্রকৃত HTTP অনুরোধটি সার্ভারের কাছে একটি ফাইল পাওয়ার জন্য প্রেরণ করা হয়েছিল route

সার্ভারের কাছে এ জাতীয় ফাইল নেই এবং অনুরোধটি পরিচালনা করতে এবং প্রতিক্রিয়া জানাতে সার্ভারে এক্সপ্রেসের মতো কোনও কিছুই কনফিগার করা হয়নি, সুতরাং সার্ভারটি 404 পাওয়া যায়নি কারণ এটি খুঁজে পেতে পারেনি route ফাইলটি ।

আমরা যা চাই তা হ'ল সার্ভারের index.htmlএকক পৃষ্ঠার অ্যাপ্লিকেশনযুক্ত ফাইলটি ফিরিয়ে দেওয়া । তারপরে রাউটারটি লাথি মেরে প্রক্রিয়া করা উচিত/route ইউআরএল ম্যাপযুক্ত উপাদানটি প্রদর্শন করা উচিত।

সুতরাং সমস্যাটি ঠিক করতে আমাদের ফিরে আসতে সার্ভারটি কনফিগার করতে হবে index.html 404 সন্ধান পাওয়া যায়নি, তার বিপরীতে অনুরোধটি পরিচালনা করা সম্ভব না হলে আমাদের (এটি আপনার একক পৃষ্ঠার অ্যাপ্লিকেশন ফাইলের নাম মনে করে)।

এটি করার উপায়টি ব্যবহৃত হওয়া সার্ভার সাইড প্রযুক্তির উপর নির্ভর করবে। উদাহরণস্বরূপ এর জাভা যদি আপনাকে কোনও সার্লেট লিখতে হতে পারে তবে রেলের মধ্যে এটি আলাদা হবে etc.

একটি কংক্রিট উদাহরণ দেওয়ার জন্য, উদাহরণস্বরূপ আপনি যদি নোডজে ব্যবহার করছেন তবে আপনাকে মিডলওয়্যারটি লিখতে হবে:

function sendSpaFileIfUnmatched(req,res) {
    res.sendFile("index.html", { root: '.' });
}

এবং তারপরে এটি মিডওয়্যার চেইনের একেবারে শেষে নিবন্ধ করুন:

app.use(sendSpaFileIfUnmatched);

এটি index.html404 ফেরতের পরিবর্তে পরিবেশন করবে , রাউটারটি কিক করবে এবং প্রত্যাশা অনুযায়ী সবকিছুই কাজ করবে।


এটা আমার সমস্যা ছিল। আপনি যদি এনজিআইএনএক্স ব্যবহার করেন তবে এই উত্তরটি সমাধান করতে সহায়তা করে: stackoverflow.com/questions/7027636/…
নাথান

জাভাটির জন্য এটি কীভাবে করবেন সে সম্পর্কে কোনও টিউটোরিয়াল রয়েছে? ধন্যবাদ।
000000000000000000000000

13

নিশ্চিত হয়ে নিন যে এটি আপনার সূচকের মূল উপাদানটিতে রয়েছে in html:

<base href="https://stackoverflow.com/">

উদাহরণ Angular2 মধ্যে রাউটিং & ন্যাভিগেশন ডকুমেন্টেশন ব্যবহারসমূহ পরিবর্তে মাথায় নিচের কোডটি (তারা ডকুমেন্টেশন লাইভ উদাহরণ নোটে কেন ব্যাখ্যা):

<script>document.write('<base href="' + document.location + '" />');</script>

আপনি যখন কোনও পৃষ্ঠা রিফ্রেশ করবেন তখন এটি আপনার বর্তমান নথিতে গতিশীলভাবে বেস href সেট করবে। লোকেশন। আমি এটি দেখতে পাচ্ছিলাম যে ডকুমেন্টেশনগুলিকে স্কিম করে লোকদের নকল করার চেষ্টা করার জন্য কিছু বিভ্রান্তির সৃষ্টি করছে।


এটি ভাগ করে নেওয়ার জন্য ধন্যবাদ। আসুন কেবল পরিষ্কার হয়ে যাক, এটি কেবল তখনই কাজ করেছিল যখন আমি <बेस href = "/"> << হেডে> সমস্ত সিএসএস লোড করার পরে এবং কোনও জেএস ফাইল লোড করার আগে রেখেছিলাম। আমি আশা করি এটি যে কাউকে সাহায্য করবে
wmehanna

আমার সূচক html এ <বেস href = "./"> আছে তারপরে 'সরানো হয়েছে'। হেরেফ থেকে এবং এটি কার্যকর হয়েছে ..
সৌরভ সোলঙ্কি

10

আপনি যদি সূচক html- তে সমস্ত অনুরোধগুলি পরিচালনা করতে আপনার অ্যাপসভারটিটি কনফিগার না করে ব্রাউজারে url লিখতে সক্ষম হতে চান তবে আপনাকে অবশ্যই হ্যাশলোকেশনস্ট্রেজি ব্যবহার করতে হবে ।

কনফিগার করার সহজতম উপায়টি হ'ল:

RouterModule.forRoot(routes, { useHash: true })

পরিবর্তে:

RouterModule.forRoot(routes)

সঙ্গে HashLocationStrategy আপনার URL গুলিতে মত করত:

http://server:port/#/path

ধন্যবাদ! এটি সাহায্য করে, তবে আমি #ইউআরএল থেকে চাই না , আমরা কি এটি সরাতে পারি?
হিদায়ত রহমান

7

ওয়েবপ্যাক-ডেভ-সার্ভার ব্যবহার করার ক্ষেত্রে আমার একই সমস্যা ছিল। আমাকে আমার ওয়েবপ্যাকে ডেভসर्ভার বিকল্পটি যুক্ত করতে হয়েছিল।

সমাধান:

// in webpack
devServer: {
    historyApiFallback: true,
    stats: 'minimal'
}


7

আপনি যদি সার্ভার হিসাবে অ্যাপাচি বা এনগিনেক্স ব্যবহার করে থাকেন তবে আপনাকে একটি তৈরি করতে হবে .htaccess(আগে তৈরি না হলে) এবং "চালু" পুনর্লিখনইঞ্জাইন

RewriteEngine On  
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ /index.html

আপনার প্রশ্নটি পেল না, এই পদ্ধতিটি অ্যাপাচি এবং এনগিনেক্স ( এনজিএনএক্স.কম ) সার্ভারে পরীক্ষিত হয়েছে
রায়

1
এটি কেবল আপাচের জন্য; Nginx কনফিগারেশন বিন্যাস সম্পূর্ণ পৃথক।
ফ্রাঙ্কলিন ইউ

5

আমার সার্ভার অ্যাপাচি, আমি রিফ্রেশ বা গভীর লিঙ্কিংয়ের সময় 404 ঠিক করতে যা করেছি তা খুব সহজ। অ্যাপাচি ভোস্ট কনফিগারেশনে কেবল একটি লাইন যুক্ত করুন:

ErrorDocument 404 /index.html

যাতে কোনও 404 ত্রুটি সূচক html এ পুনঃনির্দেশিত হয়, যা কৌনিক 2 রাউটিং চায়।

পুরো vhost ফাইল উদাহরণ:

<VirtualHost *:80>
  ServerName fenz.niwa.local
  DirectoryIndex index.html
  ErrorDocument 404 /index.html

  DocumentRoot "/Users/zhoum/Documents/workspace/fire/fire_service/dist"
  ErrorLog /Users/zhoum/Documents/workspace/fire/fire_service/logs/fenz.error.log
  CustomLog /Users/zhoum/Documents/workspace/fire/fire_service/logs/fenz.access.log combined

  <Directory "/Users/zhoum/Documents/workspace/fire/fire_service/dist">
    AllowOverride All
    Options Indexes FollowSymLinks
    #Order allow,deny
    #Allow from All
    Require all granted
  </Directory>

  Header set Access-Control-Allow-Origin "*"
  Header set Access-Control-Allow-Methods "GET, POST"
  Header set Access-Control-Allow-Credentials "true"
  Header set Access-Control-Allow-Headers "Accept-Encoding"
</VirtualHost>

আপনি কোন সার্ভার ব্যবহার করছেন তা বিবেচনাধীন, আমি মনে করি পুরো পয়েন্টটি আপনার ইনডেক্স.ইচটিএমএলে 404 পুনর্নির্দেশের জন্য সার্ভারটি কনফিগার করার উপায়গুলি সন্ধান করছে।


4

সার্ভার কনফিগারেশন কোনও এসপিএর সমাধান নয়, যা আমার মনে হয়। যদি কোনও ভুল রুট চলে আসে তবে আপনি আবার কৌণিক এসপিএ পুনরায় লোড করতে চান না? সুতরাং আমি কোনও সার্ভার রুটের উপর নির্ভর করব না এবং অন্য রুটে পুনর্নির্দেশ করব না তবে হ্যাঁ আমি সূচি html কৌণিক অ্যাপ পাথের কৌণিক রুটের জন্য সমস্ত অনুরোধগুলি পরিচালনা করতে দেব।

অন্যথায় বা ভুল রুটের পরিবর্তে এটি ব্যবহার করে দেখুন। এটি আমার পক্ষে কাজ করে, নিশ্চিত নয় তবে মনে হয় এটি কাজ চলছে। কোনও সমস্যার মুখোমুখি হওয়ার সময় আমি এটিকে হোঁচট খেয়েছি।

@RouteConfig([
  { path: '/**', redirectTo: ['MycmpnameCmp'] }, 
   ...
  }
])

https://github.com/angular/angular/issues/4055

তবে আপনার সার্ভার ফোল্ডারগুলি কনফিগার করতে এবং আপনার যদি এসপিএ নয় এমন এইচটিএমএল বা ওয়েব স্ক্রিপ্টগুলি রয়েছে ঠিক তখনই অ্যাক্সেস করতে ভুলবেন না। অন্যথায় আপনি সমস্যার মুখোমুখি হবেন। আমার মত যখন আপনার মত সমস্যার মুখোমুখি হচ্ছিল এটি সার্ভার কনফিগারেশন এবং তারপরের উপরের মিশ্রণ ছিল।


4

কৌণিক 5 দ্রুত ফিক্সের জন্য, app.module.ts সম্পাদনা করুন {useHash:true}এবং অ্যাপ্লিকেশনগুলির পরে যুক্ত করুন।

@NgModule(
{
  imports:[RouterModule.forRoot(appRoutes,{useHash:true})]
})

3

কৌণিক অ্যাপ্লিকেশনগুলি একটি সাধারণ স্ট্যাটিক এইচটিএমএল সার্ভারের সাথে পরিবেশন করার জন্য নিখুঁত প্রার্থী। অ্যাপ্লিকেশন পৃষ্ঠাগুলি গতিশীলভাবে রচনা করতে আপনার কোনও সার্ভার-সাইড ইঞ্জিনের দরকার নেই কারণ কৌণিক-পক্ষ থেকে অ্যাঙ্গুলার তা করে।

অ্যাপ্লিকেশনটি যদি কৌণিক রাউটার ব্যবহার করে তবে অ্যাপ্লিকেশনটির হোস্ট পৃষ্ঠা (index.html) এর কাছে নেই এমন ফাইলের জন্য জিজ্ঞাসা করার জন্য আপনাকে অবশ্যই সার্ভারটি কনফিগার করতে হবে।

একটি রাউন্ড অ্যাপ্লিকেশনটির "গভীর লিঙ্কগুলি" সমর্থন করা উচিত। একটি গভীর লিঙ্কটি এমন একটি ইউআরএল যা অ্যাপ্লিকেশনটির অভ্যন্তরের কোনও উপাদানটির পথ নির্দিষ্ট করে। উদাহরণস্বরূপ, http://www.example.com/heroes/42 হিরো বিশদ পৃষ্ঠার একটি গভীর লিঙ্ক যা আইডি: 42 সহ নায়ককে প্রদর্শন করে।

কোনও চলমান ক্লায়েন্টের মধ্যে থেকে যখন ব্যবহারকারী সেই ইউআরএল নেভিগেট করে তখন কোনও সমস্যা নেই। কৌণিক রাউটারটি ইউআরএলকে ব্যাখ্যা করে এবং সেই পৃষ্ঠা এবং নায়কের দিকে যাত্রা করে।

তবে কোনও ইমেলের কোনও লিঙ্কে ক্লিক করা, এটি ব্রাউজারের ঠিকানা বারে প্রবেশ করা, বা নায়ক বিশদ পৃষ্ঠায় থাকা অবস্থায় ব্রাউজারকে সতেজ করে তোলা - এই সমস্ত ক্রিয়াকলাপ নিজেই চলমান অ্যাপ্লিকেশনের বাইরে ব্রাউজার দ্বারা পরিচালিত হয়। ব্রাউজারটি সেই ইউআরএলটির জন্য রাউটারকে বাইপাস করে সার্ভারের কাছে সরাসরি অনুরোধ করে।

একটি স্থিতিশীল সার্ভার যখন নিয়মিতভাবে http://www.example.com/- এর জন্য একটি অনুরোধ পেয়ে থাকে তখন সূচক html প্রদান করে । তবে এটি http://www.example.com/heroes/42 প্রত্যাখ্যান করে এবং একটি 404 প্রদান করে - ত্রুটিটি পাওয়া যায় না যদি না পরিবর্তে সূচি html ফেরত দেওয়ার জন্য কনফিগার করা হয়

যদি এই সমস্যাটি উত্পাদনে ঘটে থাকে তবে নীচের পদক্ষেপগুলি অনুসরণ করুন

1) আপনার কৌণিক অ্যাপ্লিকেশনটির src ফোল্ডারে একটি Web.Config ফাইল যুক্ত করুন। এতে কোডের নীচে রাখুন।

<configuration>
<system.webServer>
<rewrite>
    <rules>
    <rule name="Angular 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="/" />
    </rule>
    </rules>
</rewrite>
</system.webServer>
</configuration>

2) কৌণিক- cli.json এ এটিতে একটি উল্লেখ যুক্ত করুন। কৌণিক-ক্লি.জেসনে ওয়েবকনফিগকে নীচে দেখানো হিসাবে সম্পদ ব্লকে রাখুন।

"assets": [
    "assets",
    "favicon.ico",
    "Web.config"
  ],

3) এখন আপনি উত্পাদন ব্যবহার করে সমাধান তৈরি করতে পারেন

ng build --prod

এটি একটি ডিস্ট ফোল্ডার তৈরি করবে। ডিস্ট ফোল্ডারের ভিতরে থাকা ফাইলগুলি কোনও মোড দ্বারা মোতায়েনের জন্য প্রস্তুত।


সর্বোত্তম সমাধান, কৌণিক থেকে বিশদটি সন্ধান করতে পারে: কৌণিক.আইও / গাইড / ডিপ্লোয়মেন্ট# ফলব্যাক ওয়েবকনফিগ ফাইল তৈরি করার সময় <কনফিগারেশন> </ কনফিগারেশন> ট্যাগ যুক্ত করতে ভুলবেন না। উত্তরের জন্য ধন্যবাদ মালতেশ।
পলাশ রায়

3

আপনি গড় প্রয়োগের জন্য এই সমাধানটি ব্যবহার করতে পারেন, আমি ভিউ ইঞ্জিন হিসাবে ejs ব্যবহার করেছি:

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);
app.use(function (req, res, next) {
    return res.render('index.html');
});

এবং কৌণিক-ক্লিপ.জসনেও সেট করে

"apps": [
    {
      "root": "src",
      "outDir": "views",

এটি পরিবর্তে ভাল কাজ করবে

app.get('*', function (req, res, next) {
    res.sendFile('dist/index.html', { root: __dirname });
 });

এটি পেতে ডিবি কল এবং সূচক ফেরত সূচি html নিয়ে সমস্যা তৈরি করছে


1
এটি MEAN স্ট্যাক অ্যাপ্লিকেশনের জন্য অক্টোবর 2017 এ পুরোপুরি কাজ করেছে।
মাইন্ডসেকট টিম

2

আইআইএসে আমরা যারা জীবন সংগ্রাম করে তাদের জন্য: সরকারী কৌণিক 2 ডক্সের উপর ভিত্তি করে এই সমস্যাটি সমাধান করার জন্য নিম্নলিখিত পাওয়ারশেল কোডটি ব্যবহার করুন (যে কেউ এই থ্রেডে পোস্ট করেছে? Http://blog.angular-university.io/angular2-router/ )

Import-WebAdministration
# Grab the 404 handler and update it to redirect to index.html.
$redirect = Get-WebConfiguration -filter "/system.WebServer/httperrors/error[@statusCode='404']" -PSPath IIS:\Sites\LIS 
$redirect.path = "/index.html"
$redirect.responseMode = 1
# shove the updated config back into IIS
Set-WebConfiguration -filter "/system.WebServer/httperrors/error[@statusCode='404']" -PSPath IIS:\Sites\LIS -value $redirect

এটি কৌনিক 2 ডক্সের (উপরের লিঙ্ক) পরামর্শ অনুসারে 404 / /index.html ফাইলে পুনর্নির্দেশ করে।


2

আপনি নীচে চেষ্টা করতে পারেন। এটা আমার জন্য কাজ করে!

main.component.ts

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

...
export class MainComponent implements OnInit {
    constructor(private router: Router) {
        let path: string = window.location.hash;
        if (path && path.length > 0) {
            this.router.navigate([path.substr(2)]);
        }
    }

    public ngOnInit() { }
}

আপনি রাউটারের পরামিতিগুলিতে বিভক্ত করতে পথ.সুবস্ট্র (2) আরও উন্নত করতে পারেন। আমি কৌনিক 2.4.9 ব্যবহার করছি


ব্রাউজার রিফ্রেশ পরিচালনা করার জন্য এটি সত্যিই সহায়ক ছিল! কৌণিক 5 এর জন্য, আমাকে উইন্ডো.লোকেশন.প্যাথনামটি ব্যবহার করতে কিছুটা সংশোধন করতে হয়েছিল, এবং সেই মানটি প্রত্যাশিত পাথের সাথে তুলনা করতে হয়েছিল।
ওয়ালেস হাওয়ারি 22

2

আমি শুধু। htaccess মূল যোগ করা।

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
    RewriteRule ^ - [L]
    RewriteRule ^ ./index.html
</IfModule>

এখানে আমি /
index.html তে। / index.html তে কেবল বিন্দু '।' (মূল ডিরেক্টরি) যুক্ত করব তা নিশ্চিত করুন যে আপনার বেসড পাথের সূচক html ফাইলটি মূল ডিরেক্টরি পথ এবং প্রকল্পের বিল্ডে সেট করা আছে।


1

আমি এইচটিএমএল 5 মোডে সাব পৃষ্ঠাগুলির ইউআরএল পথ সংরক্ষণ করতে চেয়েছিলাম সূচিগুলিতে কোনও পুনঃনির্দেশ না করে এবং সেখানকার কোনও সমাধানই আমাকে কীভাবে এটি করতে হয় তা বলেনি, সুতরাং আমি এটি কীভাবে সম্পাদন করেছি:

আপনার সমস্ত রুটের জন্য আইআইএসে সাধারণ ভার্চুয়াল ডিরেক্টরিগুলি তৈরি করুন এবং সেগুলি অ্যাপ্লিকেশনে রুট করুন।

এই অবস্থানের ট্যাগটি সহ আপনার সিস্টেম.ওয়েব সার্ভারটি আপনার ওয়েবকনফিগ.এক্সএমএলগুলিতে মুড়ে রাখুন, অন্যথায় আপনি এটি থেকে সদৃশ ত্রুটিগুলি পেয়ে যাবেন ভার্চুয়াল ডিরেক্টরিটির সাথে দ্বিতীয়বার ওয়েবকনফাইগ লোড করে:

<configuration>
    <location path="." inheritInChildApplications="false">
    <system.webServer>
        <defaultDocument enabled="true">
            <files>
                <add value="index.html" />
            </files>
        </defaultDocument>
    </system.webServer>
  </location>
</configuration>

1

আমি কৌনিক 2 বীজ পরীক্ষা করেছিলাম এটি কীভাবে কাজ করে।

কোনও পৃষ্ঠা পুনরায় লোড হওয়ার পরে আপনি স্বয়ংক্রিয়ভাবে পুনঃনির্দেশ করতে এক্সপ্রেস-ইতিহাস-এপি-ফ্যালব্যাক ব্যবহার করতে পারেন ।

আমি মনে করি এই সমস্যাটি সমাধানের সবচেয়ে মার্জিত উপায় আইএমও।


1

আপনি যদি প্যাথলোকেশনস্ট্রেজি ব্যবহার করতে চান:

  • ওয়াইল্ডফ্লাই কনফিগারেশন:
    • WEB-INF এ রাখার জন্য আন্ডারউইন্ড-হ্যান্ডলার্স.কনফ ফাইল তৈরি করুন
    • সামগ্রী: (আপনার বিশ্রামের সমাপ্তিগুলি বাদ দিন!)
      • রিজেক্স ['(। / ওভারভিউ / ?? $)'] এবং রিজেক্স নয় ['(। / শেষ পয়েন্ট। )'] -> পুনর্লিখন ['/ index.html']
      • রিজেক্স ['(। / মোতায়েন / /?। $)'] এবং রিজেক্স নয় ['(। / শেষ পয়েন্ট। )'] -> পুনর্লিখন ['/ index.html']

জাভা ইই / ওয়াইল্ডফ্লাইয়ের সাথে একক পৃষ্ঠার অ্যাপ্লিকেশন: সার্ভার-সাইড কনফিগারেশন


1

2017-জুলাই -11: যেহেতু এটি লিঙ্কযুক্ত এটি এই সমস্যাযুক্ত একটি প্রশ্নের তবে ইলেক্ট্রনের সাথে কৌনিক 2 ব্যবহার করে, আমি এখানে আমার সমাধান যুক্ত করব।

আমাকে যা করতে হয়েছিল তা হ'ল <base href="./">আমার সূচক html থেকে সরানো এবং ইলেক্ট্রন সফলভাবে পৃষ্ঠা পুনরায় লোড করা শুরু করেছিল।


1

আমদানি যুক্ত করুন:

import { HashLocationStrategy, LocationStrategy } from '@angular/common';

এবং এনজিএমডিউল সরবরাহকারীতে যুক্ত করুন:

providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}]

মূল সূচীতে। Html অ্যাপের ফাইলটি বেস href ./index.htmlথেকে এটিকে পরিবর্তন করে/

অ্যাপ্লিকেশনটি কোনও সার্ভারে মোতায়েনের সময় পৃষ্ঠাটির জন্য একটি সত্যিকারের url দেবে যা কোনও বাহ্যিক অ্যাপ্লিকেশন থেকে অ্যাক্সেস করা যেতে পারে।


1

শুধু যোগ .htaccess root- র মধ্যে 404 সমস্যাগুলি সমাধান করা যখন কৌণিক 4 apache2 মধ্যে পৃষ্ঠাটি রিফ্রেশ।

<IfModule mod_rewrite.c>
    RewriteEngine on

    # Don't rewrite files or directories
    RewriteCond %{REQUEST_FILENAME} -f [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^ - [L]

    # Rewrite everything else to index.html
    # to allow html5 state links
    RewriteRule ^ index.html [L]
</IfModule>

1

আমি মনে করি আপনি 404 পাচ্ছেন কারণ আপনি http: // লোকালহস্ট / রুটটির অনুরোধ করছেন যা টমক্যাট সার্ভারে নেই। যেহেতু কৌণিক 2 টি ইউআরএল শেষে হ্যাশ ব্যবহার না করে ডিফল্টরূপে এইচটিএমএল 5 রাউটিং ব্যবহার করে, পৃষ্ঠাটি রিফ্রেশ করে অন্য উত্সটির অনুরোধ মনে হয়।

টমক্যাটে কৌনিক রাউটিং ব্যবহার করার সময় আপনাকে নিশ্চিত করতে হবে যে পৃষ্ঠাটি সতেজ করার সময় আপনার সার্ভার আপনার অ্যাপের সমস্ত রুটগুলি আপনার মূল সূচক html এ মানচিত্র করবে। এই সমস্যাটি সমাধানের একাধিক উপায় রয়েছে। যে কোনও একটি আপনার পক্ষে স্যুট করতে পারেন for

1) আপনার স্থাপনার ফোল্ডারের ওয়েব.এক্সএমএল এর নীচে কোডটি রাখুন:

<error-page>
     <error-code>404</error-code>
     <location>/index.html</location>
</error-page>

২) আপনি রুটগুলির জন্য ইউআরএলে # এর সাথে হ্যাশলোকেশনস্ট্র্যাটজি ব্যবহার করে দেখতে পারেন:

ব্যবহার করার চেষ্টা করুন:

রাউটারমডিউল.রোট (রুট, {ইউজ হ্যাশ: সত্য})

পরিবর্তে:

RouterModule.forRoot (রুট)

হ্যাশলোকেশনস্ট্রেটজি সহ আপনার ইউআরএলগুলি এমন হতে পারে:

HTTP: // স্থানীয় হোস্ট / # / রুট

3) টমক্যাট ইউআরএল পুনর্লিখন ভালভ: যদি সংস্থানটি খুঁজে পাওয়া যায় না তবে সূচক html এ পুনর্নির্দেশ করতে সার্ভার স্তর কনফিগারেশন ব্যবহার করে ইউআরএলগুলি পুনরায় লিখুন।

৩.১) মেটা-আইএনএফ ফোল্ডারের অভ্যন্তরে একটি ফাইল কনটেক্সট.এক্সএমএল তৈরি করুন এবং এর নীচের প্রসঙ্গটি অনুলিপি করুন।

<? xml version='1.0' encoding='utf-8'?>
<Context>
  <Valve className="org.apache.catalina.valves.rewrite.RewriteValve" />
</Context>

৩.২) ওয়েব-আইএনএফের ভিতরে, পুনর্লিখনের ফাইলটি তৈরি করুন (এই ফাইলটিতে ইউআরএল পুনর্লিখনের নিয়ম রয়েছে এবং ইউআরএল পুনর্লিখনের জন্য টমক্যাট দ্বারা ব্যবহৃত হয়েছে)। Rewrite.config এর ভিতরে, নীচের সামগ্রীটি অনুলিপি করুন:

  RewriteCond %{SERVLET_PATH} !-f
  RewriteRule ^/(.*)$ /index.html [L]

0

এটি সঠিক উত্তর নয় তবে রিফ্রেশ করে আপনি 404 পৃষ্ঠার ত্যাগ করে সমস্ত মৃত কলগুলি হোমপৃষ্ঠায় পুনর্নির্দেশ করতে পারেন এটি অস্থায়ী হ্যাক মাত্র 404.html ফাইলটিতে পুনরায় খেলুন

<!doctype html>
<html>
    <head>
        <script type="text/javascript">
            window.location.href = "http://" + document.location.host;
        </script>
    </head>
</html>

0

"রাউটার-না-ওয়ার্কিং-রি-লোডিং-দ্য ব্রাউজার" এর সমাধানের সর্বোত্তম সমাধানটি হ'ল আমাদের স্পা-ফ্যাল ফিরে ব্যবহার করা উচিত। আপনি যদি asp.net কোর দিয়ে কৌনিক 2 অ্যাপ্লিকেশন ব্যবহার করছেন তবে আমাদের এটি "স্টার্টআপস" পৃষ্ঠায় সংজ্ঞায়িত করতে হবে। এমভিসি রাউটের অধীনে। আমি কোডটি সংযুক্ত করছি।

 app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
            routes.MapSpaFallbackRoute("spa-fallback", new { controller = "Home", action = "Index" });
        });

0

উত্তরটি বেশ জটিল। আপনি যদি সরল পুরানো অ্যাপাচি সার্ভার (বা আইআইএস) ব্যবহার করেন তবে সমস্যাটি পাবেন কারণ কৌণিক পৃষ্ঠাগুলি বাস্তবের জন্য বিদ্যমান নেই। তারা কৌণিক রুট থেকে "গণিত" হয়।

সমস্যাটি সমাধানের বিভিন্ন উপায় রয়েছে। একটি হ্যাশলোকেশনস্ট্রেজি ব্যবহার করা দ্বারা প্রদত্ত । তবে ইউআরএলটিতে একটি তীক্ষ্ণ চিহ্ন যুক্ত করা হয়েছে। এটি মূলত কৌণিক 1 (আমি ধরে নিই) সাথে সামঞ্জস্য করার জন্য। সত্যটি ইউআরএল-এর অংশ না হওয়ার পরে অংশটি হ'ল (তারপরে সার্ভার "#" চিহ্নের আগে অংশটি সমাধান করে)। এটি নিখুঁত হতে পারে।

এখানে একটি বর্ধিত পদ্ধতি (404 ট্রিকের উপর ভিত্তি করে)। আমি ধরে নিলাম আপনার কৌণিক অ্যাপ্লিকেশনটির "বিতরণ" সংস্করণ রয়েছে (ng build --prod আপনি যদি -সিএলআই ব্যবহার করেন) এবং আপনি সরাসরি আপনার সার্ভারের মাধ্যমে পৃষ্ঠাগুলি অ্যাক্সেস করেন এবং পিএইচপি সক্ষম হয়ে থাকে।

যদি আপনার ওয়েবসাইট পৃষ্ঠাগুলির উপর ভিত্তি করে থাকে (উদাহরণস্বরূপ ওয়ার্ডপ্রেস) এবং আপনার কাছে একটি মাত্র ফোল্ডার রয়েছে যা কৌণিককে উত্সর্গীকৃত (আমার উদাহরণে "ডিস" নাম দেওয়া হয়েছে), আপনি কিছুটা অদ্ভুত কিছু করতে পারেন তবে, শেষে, সহজ। আমি ধরে নিই যে আপনি আপনার কৌনিক পৃষ্ঠাগুলি "/ ডিস্ট" -তে সংরক্ষণ করেছেন (সেই অনুযায়ী)<BASE HREF="/dist/"> ) সংরক্ষণ করেছেন। এখন একটি 404 পুনর্নির্দেশ এবং পিএইচপি এর সহায়তা ব্যবহার করুন।

আপনার অ্যাপাচি কনফিগারেশনে (বা .htaccessআপনার কৌণিক অ্যাপ্লিকেশন ডিরেক্টরি ফাইলের মধ্যে) আপনাকে অবশ্যই যুক্ত করতে হবেErrorDocument 404 /404.php

404.php নিম্নলিখিত কোড দিয়ে শুরু হবে:

<?php
$angular='/dist/';
if( substr($_SERVER['REQUEST_URI'], 0, strlen($angular)) == $angular ){
    $index = $_SERVER['DOCUMENT_ROOT'] . $angular . "index.html";
    http_response_code(200);
    include $index;
    die;
}

// NOT ANGULAR...
echo "<h1>Not found.</h1>"

যেখানে $angularআপনার কৌণিক এর href সঞ্চিত মান index.html

নীতিটি বেশ সহজ, যদি আপাচি পৃষ্ঠাটি না খুঁজে পান তবে পিএইচপি স্ক্রিপ্টে 404 পুনর্নির্দেশ করা হয়। পৃষ্ঠাটি কৌনিক অ্যাপ্লিকেশন ডিরেক্টরিটির ভিতরে রয়েছে কিনা তা আমরা কেবল খতিয়ে দেখি। যদি এটি হয় তবে আমরা কেবল সূচক html সরাসরি লোড করি (পুনর্নির্দেশ ছাড়াই): ইউআরএল অপরিবর্তিত রাখার জন্য এটি প্রয়োজনীয়। আমরা এইচটিপি কোডটি 404 থেকে 200 এ পরিবর্তন করি (ক্রলারের জন্য আরও ভাল)।

যদি কৌণিক প্রয়োগে পৃষ্ঠাটির অস্তিত্ব না থাকে তবে কী হবে? ঠিক আছে, আমরা কৌণিক রাউটারের "ক্যাচ অল" ব্যবহার করি (কৌণিক রাউটার ডকুমেন্টেশন দেখুন)।

এই পদ্ধতিটি একটি প্রাথমিক ওয়েবসাইটের ভিতরে এম্বেডেড কৌণিক অ্যাপ্লিকেশনটির সাথে কাজ করে (আমি মনে করি ভবিষ্যতে এটি হবে)।

মন্তব্য:

  • একইভাবে কাজ করার চেষ্টা করছেন mod_redirect(URL গুলি rewriting দ্বারা) একটি ভাল সমাধান কারণ ফাইল (সম্পদ মত) সত্যিই লোড করা আছে তারপর, এটা অনেক শুধু "not found" সলিউশন ব্যবহার চেয়েও বেশি ঝুঁকিপূর্ণ সব সময়ে নয়।
  • কেবল ErrorDocument 404 /dist/index.htmlকাজগুলি ব্যবহার করে পুনর্নির্দেশ করা হচ্ছে তবে অ্যাপাচি এখনও 404 ত্রুটি কোডের সাথে সাড়া দিচ্ছে (যা ক্রলারগুলির পক্ষে খারাপ)।

0

এটি সমস্যার স্থায়ী ফিক্স নয় বরং আরও অনেকটা কাজের চাপ বা হ্যাকের মতো like

আমার কৌণিক অ্যাপ্লিকেশনটি ঘ-পৃষ্ঠাগুলিতে স্থাপন করার সময় আমার এই একই সমস্যা ছিল। জি-পৃষ্ঠাগুলিতে আমার পৃষ্ঠাগুলি রিফ্রেশ করার সময় প্রথমে 404 বার্তা দিয়ে আমাকে স্বাগত জানানো হয়েছিল।

তারপরে @ গুনটার যা বলেছিল আমি ব্যবহার শুরু করি HashLocationStrategyযা কৌনিক 2 সরবরাহ করা হয়েছিল।

তবে #এটি ইউআরএলটিতে সমস্যাগুলির নিজস্ব সেট নিয়ে এসেছিল যা সত্যিই খারাপ ছিল ইউআরএলটিকে আরও খারাপ করে তোলে https://rahulrsingh09.github.io/AngularConcepts/#/faq

আমি এই সমস্যাটি সম্পর্কে গবেষণা শুরু করে একটি ব্লগ জুড়ে এসেছি। আমি এটিকে শট দেওয়ার চেষ্টা করেছি এবং এটি কার্যকর হয়েছে।

আমি এই ব্লগে উল্লিখিত হিসাবে কি করেছি।

আপনাকে আপনার জিএইচ-পৃষ্ঠাগুলির রেপোতে একটি 404.html ফাইল যুক্ত করে সূচনা করতে হবে যা এর ভিতরে একটি খালি HTML ডকুমেন্ট রয়েছে - তবে আপনার দস্তাবেজটি অবশ্যই 512 বাইটেরও বেশি (নীচে বর্ণিত) থাকতে হবে। এরপরে আপনার 404.html পৃষ্ঠার প্রধান উপাদানটিতে নিম্নলিখিত মার্কআপটি রাখুন:

<script>
  sessionStorage.redirect = location.href;
</script>
<meta http-equiv="refresh" content="0;URL='/REPO_NAME_HERE'"></meta>

এই কোডটি প্রয়াসের প্রবেশদ্বার ইউআরএলটিকে স্ট্যান্ডার্ড সেশনসটরেজ অবজেক্টের একটি চলকটিতে সেট করে এবং তাত্ক্ষণিকভাবে একটি মেটা রিফ্রেশ ট্যাগ ব্যবহার করে আপনার প্রকল্পের ইনডেক্স। Html পৃষ্ঠায় পুনঃনির্দেশ করে। যদি আপনি একটি গিথুব সংস্থার সাইট করছেন, তবে বিষয়বস্তু বিশিষ্ট replacer পাঠ্যে কোনও রেপো নাম রাখবেন না, কেবল এটি করুন: সামগ্রী = "0; URL = '/'"

প্রাথমিকভাবে ব্যবহারকারী নেভিগ্রেটেড ইউআরএল ক্যাপচার এবং পুনরুদ্ধার করার জন্য, পৃষ্ঠার বর্তমান অবস্থাতে অন্য কোনও জাভাস্ক্রিপ্টের ক্রিয়াকলাপের আগে আপনাকে নিম্নলিখিত সূচী ট্যাগটি আপনার সূচিপত্রের html পৃষ্ঠাতে যুক্ত করতে হবে:

<script>
  (function(){
    var redirect = sessionStorage.redirect;
    delete sessionStorage.redirect;
    if (redirect && redirect != location.href) {
      history.replaceState(null, null, redirect);
    }
  })();
</script>

জাভাস্ক্রিপ্টের এই বিটটি 404 এইচটিএমএল পৃষ্ঠায় আমরা সেশনসটোরেজে ক্যাশেড URL টি পুনরুদ্ধার করে এবং এটির সাথে বর্তমান ইতিহাসের এন্ট্রিটি প্রতিস্থাপন করে।

রেফারেন্স ব্যাকলেইকোডার এই কাজের জন্য @ ড্যানিয়েলকে ধন্যবাদ।

এখন উপরের ইউআরএলটি https://rahulrsingh09.github.io/AngularConcepts/faq এ পরিবর্তিত হয়েছে


0

আমি এটি (জাভা / স্প্রিং ব্যাকএন্ড ব্যবহার করে) আমার অ্যাংুলার রুটে সংজ্ঞায়িত সমস্ত কিছুর সাথে মেলে এমন হ্যান্ডলার যুক্ত করে স্থির করেছি, যা 404 এর পরিবর্তে সূচক html ফেরত পাঠায় This এটি কার্যকরভাবে (পুনরায়) অ্যাপ্লিকেশনটিকে বুটস্ট্র্যাপ করে এবং সঠিক পৃষ্ঠাটি লোড করে। আমার কাছে এমন কোনও কিছুর জন্য 404 হ্যান্ডলার রয়েছে যা এটির দ্বারা ধরা পড়ে না।

@Controller         ////don't use RestController or it will just send back the string "index.html"
public class Redirect {

    private static final Logger logger = LoggerFactory.getLogger(Redirect.class);

    @RequestMapping(value = {"comma", "sep", "list", "of", "routes"})
    public String redirectToIndex(HttpServletRequest request) {
        logger.warn("Redirect api called for URL {}. Sending index.html back instead. This will happen on a page refresh or reload when the page is on an Angular route", request.getRequestURL());
        return "/index.html";
    }
}

0

আপনি যদি সার্ভার হিসাবে অ্যাপাচি বা এনগিনেক্স ব্যবহার করে থাকেন তবে আপনাকে একটি .htaccess তৈরি করতে হবে

<IfModule mime_module>
      AddHandler application/x-httpd-ea-php72 .php .php7 .phtml
    </IfModule>
    # php -- END cPanel-generated handler, do not edit

    <IfModule mod_rewrite.c>
        RewriteEngine on

        # Don't rewrite files or directories
        RewriteCond %{REQUEST_FILENAME} -f [OR]
        RewriteCond %{REQUEST_FILENAME} -d
        RewriteRule ^ - [L]

        # Rewrite everything else to index.html
        # to allow html5 state links
        RewriteRule ^ index.html [L]
    </IfModule>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.