CODEWITHSUNDEEP
reactjsfirebasesitemapfirebase-hostinggoogle-search-api
parohy
parohy

Reputation: 2180

How to use sitemap in firebase hosting with react app

I have deployed a reactjs web app on my firebase hosting. I added a sitemap.xml file to the public folder. I edited firebase.json to route the source to sitemap.xml:

"redirects": [
      {
        "source": "/sitemap",
        "destination": "/sitemap.xml",
        "type": 302
      }
    ],
"rewrites": [
  {
    "source": "/*",
    "destination": "/index.html"
  }
]

But when ever I go https://blah blah.com/sitemap it always returns index.html I tried to add it to rewrites as well but it seems it always returns index.html.

I am using React Router 4 as well for routing, maybe that effects this.

<Switch>
        <Route component={Login} exact path="/login" />
        <Route component={Home} path="/home" />
        <Route component={About} path="/about" />
        <Route component={Carousel} path="/carousel/:galleryRef/:ref" />
        <Route component={RelayEditPage} path="/edit/:galleryRef" />
        <Route path="/" render={() => <Redirect to="/home" />} />
      </Switch>

How can I add the sitemap to hosting domain? If I add a Redirect component inside the Switch it works but then I am unable to set Google search console sitemap because of the redirect.

Upvotes: 3

Views: 2417

Answers (3)

John Anisere
John Anisere

Reputation: 542

This worked for me:

"redirects": [
  {
    "source": "/sitemap",
    "destination": "/sitemap.xml",
    "type": 301
  },
  {
    "source": "/sitemap/**",
    "destination": "/sitemap.xml",
    "type": 302
  }
]

Upvotes: 3

adri.de
adri.de

Reputation: 1

I had the same problem as you. Using the following configuration made the files in my public folder (including the sitemap) accessible online after deployment:

"rewrites": [
  {
    "source": "/",
    "destination": "/index.html"
  },
  {
    "source": "/sitemap",
    "destination": "/sitemap.xml"
  }
]

Upvotes: 0

Ayush Gupta
Ayush Gupta

Reputation: 143

Try deleting index.html file. I have created a website in that I deleted the index.html from public folder and instead used index.js in functions folder.

Upvotes: 0

Related Questions