একই ধরণের সমস্যা খুঁজছিল। আমি উপরে বর্ণিত প্রস্তাবিত সমাধানগুলির মিশ্রণটি ব্যবহার করে শেষ করেছি।
প্রথমত, আমার একাধিক ফোল্ডার সহ একটি এস 3 বালতি রয়েছে, প্রতিটি ফোল্ডার একটি প্রতিক্রিয়া / রিডেক্স ওয়েবসাইট উপস্থাপন করে। আমি ক্যাশে অবৈধকরণের জন্য ক্লাউডফ্রন্টও ব্যবহার করি।
সুতরাং 404 সমর্থন করার জন্য আমাকে রাউটিং বিধিগুলি ব্যবহার করতে হয়েছিল এবং সেগুলি হ্যাশ কনফিগারেশনে পুনর্নির্দেশ করতে হয়েছিল:
<RoutingRules>
<RoutingRule>
<Condition>
<KeyPrefixEquals>website1/</KeyPrefixEquals>
<HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
</Condition>
<Redirect>
<Protocol>https</Protocol>
<HostName>my.host.com</HostName>
<ReplaceKeyPrefixWith>website1#</ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>
<RoutingRule>
<Condition>
<KeyPrefixEquals>website2/</KeyPrefixEquals>
<HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
</Condition>
<Redirect>
<Protocol>https</Protocol>
<HostName>my.host.com</HostName>
<ReplaceKeyPrefixWith>website2#</ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>
<RoutingRule>
<Condition>
<KeyPrefixEquals>website3/</KeyPrefixEquals>
<HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
</Condition>
<Redirect>
<Protocol>https</Protocol>
<HostName>my.host.com</HostName>
<ReplaceKeyPrefixWith>website3#</ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>
</RoutingRules>
আমার জেএস কোডে, আমার এটিকে baseNameরিঅ্যাক্ট-রাউটারের জন্য একটি কনফিগার দিয়ে পরিচালনা করতে হবে । প্রথমত, নিশ্চিত হয়ে নিন যে আপনার নির্ভরতা আন্তঃব্যক্তিক, আমি ইনস্টল করেছিলাম যা history==4.0.0বেমানান ছিলreact-router==3.0.1 ।
আমার নির্ভরতাগুলি হ'ল:
- "ইতিহাস": "৩.২.০",
- "প্রতিক্রিয়া": "15.4.1",
- "প্রতিক্রিয়া-রিডাক্স": "4.4.6",
- "প্রতিক্রিয়া-রাউটার": "3.0.1",
- "প্রতিক্রিয়া-রাউটার-রিডাক্স": "4.0.7",
history.jsইতিহাস লোড করার জন্য আমি একটি ফাইল তৈরি করেছি :
import {useRouterHistory} from 'react-router';
import createBrowserHistory from 'history/lib/createBrowserHistory';
export const browserHistory = useRouterHistory(createBrowserHistory)({
basename: '/website1/',
});
browserHistory.listen((location) => {
const path = (/#(.*)$/.exec(location.hash) || [])[1];
if (path) {
browserHistory.replace(path);
}
});
export default browserHistory;
কোডের এই টুকরাটি হ্যাশ দিয়ে সেভের দ্বারা প্রেরিত 404 টি পরিচালনা করার অনুমতি দেয় এবং আমাদের রুটগুলি লোড করার জন্য ইতিহাসে এগুলি প্রতিস্থাপন করে।
আপনি এখন আপনার স্টোরটি আপনার রুট ফাইলটিকে কনফিগার করার জন্য এই ফাইলটি ব্যবহার করতে পারেন।
import {routerMiddleware} from 'react-router-redux';
import {applyMiddleware, compose} from 'redux';
import rootSaga from '../sagas';
import rootReducer from '../reducers';
import {createInjectSagasStore, sagaMiddleware} from './redux-sagas-injector';
import {browserHistory} from '../history';
export default function configureStore(initialState) {
const enhancers = [
applyMiddleware(
sagaMiddleware,
routerMiddleware(browserHistory),
)];
return createInjectSagasStore(rootReducer, rootSaga, initialState, compose(...enhancers));
}
import React, {PropTypes} from 'react';
import {Provider} from 'react-redux';
import {Router} from 'react-router';
import {syncHistoryWithStore} from 'react-router-redux';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import variables from '!!sass-variable-loader!../../../css/variables/variables.prod.scss';
import routesFactory from '../routes';
import {browserHistory} from '../history';
const muiTheme = getMuiTheme({
palette: {
primary1Color: variables.baseColor,
},
});
const Root = ({store}) => {
const history = syncHistoryWithStore(browserHistory, store);
const routes = routesFactory(store);
return (
<Provider {...{store}}>
<MuiThemeProvider muiTheme={muiTheme}>
<Router {...{history, routes}} />
</MuiThemeProvider>
</Provider>
);
};
Root.propTypes = {
store: PropTypes.shape({}).isRequired,
};
export default Root;
আশা করি এটা সাহায্য করবে. আপনি এই কনফিগারেশনের সাথে লক্ষ্য করবেন আমি রাউডিংয়ের মাধ্যমে জাভাস্ক্রিপ্ট অ্যাসিঙ্ক্রোভনলি লোড করার জন্য হুডব্রিউ ইনজেক্টর এবং একটি হোমব্রিউ সাগা ইনজেক্টর ব্যবহার করব। থিসিস লাইনের সাথে কিছু মনে করবেন না।
