React-Router redirect through server
<p>So I'm working on a site that wants links with the following path:</p>

<pre><code>localhost:3000/visit/:name
</code></pre>

<p>To redirect to an external url for example google.com?affiliateID=2. The redirect needs to be nofollow with status code 307.</p>

<p>The app is universal; server-side rendering using express &amp; client-side react, both using a shared routes via react-router.</p>

<p>routes.js</p>

<pre><code>&lt;Route status={307} path="visit/:slug" /&gt;
</code></pre>

<p>server.js</p>

<pre><code>app.use((req, res) =&gt; {
  match({routes, location: req.originalUrl}, (err, redirectLocation, renderProps) =&gt; {
   if (err) {
    res.status(500).send(err.message)
   } else if (redirectLocation) {
    res.redirect(302, redirectLocation.pathname + redirectLocation.search)
   } else if (renderProps) {
    const html = renderToString(&lt;RouterContext {...renderProps} /&gt;)

    const isAffiliateLink = renderProps.routes.filter((route) =&gt; {
     return route.status === 307
    }).length &gt; 0

   if (isAffiliateLink) {
    return res.redirect(307, "http://google.com")
   }

   const markup = renderToStaticMarkup(&lt;Document html={html} /&gt;)

   res.status(200).send("&lt;!DOCTYPE html&gt;" + markup)
  } else {
    res.status(404).send("Not Found")
  }
 })
})
</code></pre>

<p>here I'm checking if the requested route is the /visit/slug by checking the status, 307. If that is the case, it will redirect to the destination. This works.</p>

<p>What I struggle with now however is that I have hundreds of affiliate links, with different URLs and each with a corresponding slug.</p>

<p>What is the best way to programmatically input the right url for the right slug?
In the Route I can give a prop</p>

<pre><code>&lt;Route path="/visit/:slug" url="url.com" /&gt;
</code></pre>

<p>which I can access from server.js, but I'm not sure how to make that one dynamic depending on the slug.</p>

<p>Or should I do an API call to a database on server.js that has all the slugs and their corresponding URL?</p>

<p>Or is there a way I can pass a prop to the Route from a component that is used to click the link? Ie </p>

<pre><code>&lt;AffiliateLink slug={slug} url={url} /&gt;
</code></pre>

<p>Any help is much appreciated</p>