I have a React SPA published on IIS which is using React Router for URL routes which is working perfectly however within the public directory i have a sub folder that is completely separate to the React project that im trying to access however it doesnt seem to be working:
URL: http://{REACT_SPA}/Dev (/Dev is a sub folder)
web.config:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="ReactRouter Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
</conditions>
<action type="Rewrite" url="index.html" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
any ideas?
I made a react app using create-react-app. I am trying to deploy it on azure web app. I created a build and deployed using FTP.
When there is the internal redirect from the react the app I am able to see the webpage. But when I try to directly go to the url, I get this error.
For example:
if base url is www.example.com, and the app internally redirects to /new, the page goes to www.example.com/new. But if I directly try to load www.example.com/new, I get the above shown response. This doesn't happen in local testing
Demo:
I have created a demo here
For it to work for me, I added a web.config-file in the public-folder (this is where favicon.ico, index.html & manifest.json is located), and added the following code:
<?xml version="1.0"?>
<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" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
I hope this might help :)
Place the below web.config file under the /site/wwwroot directory
<?xml version="1.0"?>
<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" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
When there is the internal redirect from the react the app I am able to see the webpage. But when I try to directly go to the url, I get this error.
The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.
If you use Network tool to capture network traffic when you click the button New to render (redirect to) the new page, you will find it just changes the URL locally instead of really requesting for http://data-trigger-mass-test.azurewebsites.net/new to the server. When you directly browse and request for http://data-trigger-mass-test.azurewebsites.net/new to the server, the server could not find the resource, so it returns (404) error. In order to make the URL http://data-trigger-mass-test.azurewebsites.net/new work on both server and client-side, you may need to set up routes for it on both server and client side.
Your server should always send the root html file for all client request, so that it can pass routing to react.
If the server is NodeJs, add something like below into your server.js.
app.get('*', (req, res) => {
res.sendFile('public/index.html', { root: __dirname });
});
This worked:
<?xml version="1.0"?>
<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" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
I created a web.config file in the public-folder where the index.html is located and added the above code.
I have a shared Windows hosting account on Ez-DomainNameRegistration. I have setup a subdomain that routes to a subfolder and uploaded my Zend framework website to the folder. FYI: the website works on my local pc on IIS 7. The problem I have is that the layout of the site is correctly loaded, but the controller-action routing does not work. Instead of the view of the action I get the 404 error view. My guess is that it has something to do with the url routing.
In the route folder (the subfolder pointed to by the subdomain) I have the following web.config file:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Imported Rule 14" stopProcessing="true">
<match url="\.(js|gif|jpg|png|css|txt|svg)$" negate="true" ignoreCase="false" />
<action type="Rewrite" url="public/index.php{R:1}" />
</rule>
<rule name="Imported Rule 15" stopProcessing="true">
<match url="^(.*)$" ignoreCase="false" />
<action type="Rewrite" url="public/{R:1}" />
</rule>
</rules>
</rewrite>
And in the public folder I have the following web.config:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Imported Rule 1" stopProcessing="true">
<match url="^.*$" />
<conditions logicalGrouping="MatchAny">
<add input="{REQUEST_FILENAME}" matchType="IsFile" pattern="" ignoreCase="false" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" pattern="" ignoreCase="false" />
</conditions>
<action type="None" />
</rule>
<rule name="Imported Rule 2" stopProcessing="true">
<match url="^.*$" />
<action type="Rewrite" url="index.php" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
Is there something I can change to make the routing work in side a subdomain/subfolder on iis 7?
I am trying to make frindly URLs using web.config, and it must rewrite from 1 to (possibly) 2 variables and ignore rewrite if it's a directory name. So I have this URL:
http://www.domain.com/2014/ - Where 2014 is a folder.
http://www.domain.com/2014/publications/ - It's one of the possible URLs
http://www.domain.com/2014/publications/news/ - Another possible URL
While the real URLs would be
http://www.domain.com/2014/
http://www.domain.com/2014/?page=publications
http://www.domain.com/2014/?page=publications&subpage=news
I am trying this web.config but I am getting an error 500.
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Friendly 2">
<match url="^([a-zA-Z0-9_-]+)/([a-zA-Z0-9_-]+)$" ignoreCase="false" />
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/2014/index.php?page={R:1}&subpage={R:2}" appendQueryString="false" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
Am I missing something?
Thanks in advance!
I have a widows machine hosted by goddady and I need to create a rule to forward any request with a URL pointing to a non-existing file to be sent to the index.php.
Usually I would do that with the .htaccess but its different in windows hosts.
I found the answer.
I had to put a xml file named 'web.conf' in the root directory, it works in the same way .htaccess does.
I took the rules from ZendFramework Site
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Imported Rule 1" stopProcessing="true">
<match url="^.*$" />
<conditions logicalGrouping="MatchAny">
<add input="{REQUEST_FILENAME}"
matchType="IsFile" pattern=""
ignoreCase="false" />
<add input="{REQUEST_FILENAME}"
matchType="IsDirectory"
pattern=""
ignoreCase="false" />
</conditions>
<action type="None" />
</rule>
<rule name="Imported Rule 2" stopProcessing="true">
<match url="^.*$" />
<action type="Rewrite" url="index.php" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
This rules will make the server check if the file exsists and if it doesn't then the request is forwarded to index.php