Edge URL Rewrites

You can set URL rewrite rules in Contentstack Launch to rewrite specific URLs in your source code with the content in different URLs of your choice. Unlike the URL redirects feature that sends you to a completely different URL, often with an associated HTTP status code, the URL rewrites feature involves altering the URL path on the server side without necessarily changing the URL displayed in your browser.

URL rewriting offers several advantages, such as ensuring that URLs remain consistent even when underlying technology or site structure changes, preventing duplicate content issues by mapping multiple URLs to a single canonical URL, allowing you to map old URLs to new ones when you need to update or change the structure of your website, etc.

Contentstack Launch lets you specify both static and dynamic rewrites at the CDN edge. You can set your custom rewrites by adding them to the launch.json file and then adding the launch.json file to your codebase.

This step-by-step guide lets you create a project in Launch that allows URL rewrites.

Prerequisites

1. Contentstack account
2. Access to Launch for your organization

Steps for Execution

1. Create the launch.json file
2. Deploy your project in Launch

1. Create the launch.json File

   Follow the steps to create the launch.json file for URL rewrites:

   1. Open your source code folder.
   2. Create a JSON file named launch.json inside the folder, and paste the following code into it:
      {
        "rewrites": [
          {
            "source": "/source",
            "destination": "/destination"
          }
        ]
      }
      

   3. Replace /source in the code with your source route.
   4. Replace /destination in the code with your destination route.

      Note: The source and destination URLs must be within 512 characters each.

   5. Save the launch.json file.

      Note: The file size must be limited to 200KB.

   

   Examples for the uses of Edge URL Rewrites

   • Using a path variable, you can create dynamic, structured, and manageable rewrites on your website.
     Example:
     {
       "rewrites": [
         {
           "source": "/blog/:slug",
           "destination": "/news/:slug"
         }
       ]
     }
     

     This example uses a path variable slug to rewrite requests to any path (including subdirectories) under /blog/, from a corresponding path under /news/.

   • Assigning path variables with regex-based rewrites ensures seamless rewriting of blog post URLs from their corresponding post pages.
     Example:
     {
       "rewrites": [
         {
           "source": "/blog/post/:id=(\\d+)",
           "destination": "/posts/:id"
         }
       ]
     }
     

     In this example, if the value from URLs like /blog/post/123 matches with the regular expression in the source pattern /blog/post/:id=(\\d+), the content in /posts/123 rewrites to the URL /blog/post/123, dynamically replacing :id with the captured value.

   • Using an absolute path, you can rewrite your site’s URL with the content from an external link.
     Example:
     {
       "rewrites": [
         {
           "source": "/blog/post",
           "destination": "https://mywebsite.com/news/page"
         }
       ]
     }
     

     In this example, the requests to the path /blog/post rewrites the content in /blog/post with the content in an external site https://mywebsite.com/news/page.

   • You can rewrite URLs that include query parameters.
     Example:
     {
       "rewrites": [
         {
           "source": "/test/:path((?!excluded-uri).+)\\?posts=:search(.+)",
           "destination": "/:path/:search"
         }
       ]
     }
     

     With this configuration, requests like /test/my-page?posts=my-search rewrites to /my-page/my-search while preserving the query parameter. The :path and :search variables capture values from the source URL and insert them into the destination URL.

     These examples demonstrate the flexibility of Edge URL Rewrites, allowing you to create custom URL structures and seamlessly integrate external content into your website.

2. Deploy your Project in Launch

   Deploy your project in Launch by importing the source code from GitHub or by uploading the source code folder.

   After successful deployment, the Logs section displays the count of rewrites as follows:

   

Limitation

• Adding a launch.json file to an app within a monorepo is currently not supported.