score:1
Accepted answer
i tried lots of things to make this work without touching wordpress, but finally i gave up and entered a well-commented patch into my wordpress /index.php
.
.htaccess
:
# begin myapp
#
# set the request_uri to just /myapp for any deeper uri for the myapp react router.
#
# unfortunately, this winds up setting redirect_request_uri rather than
# request_uri. see /index.php for a custom patch that works around this.
#
# issue documented here: http://stackoverflow.com/a/10128290/1426950
setenvif request_uri "myapp/.*" request_uri=/myapp/
# end myapp
/index.php
:
/**
*
* custom patch
*
* work around an apache issue documented here: http://stackoverflow.com/a/10128290/1426950
* we need it for the react app at /myapp/.
*
* we need the wordpress page at /myapp/ to be served for any url beginning
* with /myapp/, so that we can control that namespace with react. to
* accomplish this, we set request_uri in the .htaccess, but a subsequent rewrite
* pushes that setting over to redirect_request_uri and resets request_uri.
*
* this php code fools wordpress into thinking apache did what we wanted.
*
*/
if (
$_server['redirect_request_uri'] !== null
) {
$_server['request_uri'] = $_server['redirect_request_uri'];
}
now everything works perfectly and wordpress serves the page at /myapp/
for all urls of the react app (/myapp/foo
, myapp/bar/123
, etc.).
Source: stackoverflow.com
Related Query
- How do I install a React app based on react-router's browserHistory into a WordPress page on Apache?
- How to deploy browserHistory based React applications to Azure App Service?
- How to integrate azure ad into a react web app that consumes a REST API in azure too
- How to embed React App into another website
- How to import a file into a react app that uses create react app as raw text?
- How to get size of an element in an react app that is totally based on functional components?
- How to trigger animations in a React app based on the scroll position
- How to Merge React App into existing Website with existing HTML structure
- Recoding RShiny app into React App - how to get my data to my React App
- How to insert (inject?) an existing React app (just a UI without a backend) into a SilverStripe page layout?
- How to add a custom script into React app component?
- How do I deploy my react app into my FTP
- How to Embed Google Trends into React app
- how to install the new version of react app 5.0.0
- How to Hide and show HTML based on a cookie existing or not in a React App
- How to transform the inner state based React app to Redux based?
- How can I display React component based on prop name passed into a container?
- How to sort react components based on props being passed into it
- How to integrate React app into Wordpress (react router)?
- How to integrate less into Create React App without ejecting
- How can I inject a span into a string and have it printed in my react app as HTML
- How to embede Apache Superset chart into React app
- How can I import local Bootstrap CSS into a React app without overriding my CSS files?
- How to incorporate svg path morph animation into a React app
- How to inject pod environment variables values into React app on runtime?
- How to fetch data into highchart in react app
- How do I Import Plugins into Leaflet React App
- How to get folder path from loopback into react app folder
- How to load a URL into a BrowserView in an Electron React Boilerplate app that uses MemoryRouter?
- How to install / setup Eslint, Prettier into a react app?
More Query from same tag
- Array of objects how do i check for deeply nested text string duplicates & remove from array?
- Rendering a box when submitting the data
- img not displaying in reactstrap carousel
- MDBDataTable Cannot Sort Column if Cell Contains HTML
- React useEffect clean up for multiple functions
- "jQuery is not defined" after require/import when use ES6 with Webpack 4
- Redux middleware returning callbacks not state object
- DOM cast to string
- When using container in React-Boostrap my body's background-color is overwritten
- Why am I not able to route my app using react router?
- convert from typescript to traditional node
- Unterminated JSX contents
- In React JS, when should you use a store vs directly manipulating the view's state?
- Testing with puppeteer an AWS amplify react app
- Using 'ref' on React Styled Components is not working
- How to conditionally show list items in React based on screen size
- useReducer not accepting array or state
- My simple react-dnd is not working - dragging an item causes the entire list to disappear
- Accessing data of a JSON file in React
- React-Router route component is constructed twice on page refresh
- How to invoke a const value in React
- Unknown prop- react
- ReactJS with ES6: this.props is not a function when I communicate two components
- Testing react-hook-forms submition fails
- Clicking on my radio button generates me Unexpected text node: . A text node cannot be a child of a <View> in my console
- Store JSON in a variable in a REACT Helper component
- Store item to local storage after adding a new item using redux toolkit
- ReactJS Invalid hook call while add useStyle variable
- How to get percentage using "onUploadProgress" axios?
- Display saved text onclick in React.js