# Routes with suffix

**URL:** <https://community.prismic.io/t/routes-with-suffix/11546>\
**Category:** Developing with Prismic\
**Created:** [November 2, 2022, 4:37pm UTC](https://community.prismic.io/t/routes-with-suffix/11546 "2022-11-02T16:37:10Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![engineering3](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/engineering3/32/5215_2.png) [@engineering3](https://community.prismic.io/u/engineering3)\
**Post date:** [November 2, 2022, 4:37pm UTC](https://community.prismic.io/t/routes-with-suffix/11546/1 "2022-11-02T16:37:10Z")

</div>

Defining [routes](https://prismic.io/docs/route-resolver-api-option#example) don't seem to resolve suffixes in routes for example adding `.html`.

For example

```js
  {
    type: 'blog',
    path: '/blog/:uid/baz.html',
  }

```

When using the **`resolvePreviewURL`** I would expect the document with uid `foo` to resolve to: **`/blog/foo/baz.html`** but instead, it resolves to: **`/blog/foo/baz`**

### Reproduction

I was able to reproduce this using the [prismicio/reactjs-blog (github.com)](https://github.com/prismicio/reactjs-blog) repository:

- [React Prismic App (reproduction-prismic-cra-blog.vercel.app)](https://reproduction-prismic-cra-blog.vercel.app/)
- I modified the blog links manually to [append the suffix](https://github.com/paul-vd/reproduction-prismic-cra-blog/blob/67e5d93bb249d61d467adaf04eb4f9fbf46a983a/src/components/PostList/PostItem.js#L7-L11)

Of course, previews would not work here, and anything using the asLink would also not work.

### Source

After some further investigation, it seems like it's the result returned from the API, using this request:

[https://fc-react-blog.cdn.prismic.io/api/v2/documents/search?q=[[at(document.id%2C+"XFGlSxAAACEARS7\_")]]&ref=https%3A%2F%2Ffc-react-blog.prismic.io%2Fpreviews%2FY2NauhQAAMDemvIl%3FwebsitePreviewId%3DY2NbhRQAACUAmvW4&routes=[{"type"%3A"post"%2C"path"%3A"%2Fblog%2F%3Auid%2Ffoo.html"}%2C{"type"%3A"blog\_home"%2C"path"%3A"%2F"}]](https://fc-react-blog.cdn.prismic.io/api/v2/documents/search?q=%5B%5Bat%28document.id%2C+%22XFGlSxAAACEARS7_%22%29%5D%5D&ref=https%3A%2F%2Ffc-react-blog.prismic.io%2Fpreviews%2FY2NauhQAAMDemvIl%3FwebsitePreviewId%3DY2NbhRQAACUAmvW4&routes=%5B%7B%22type%22%3A%22post%22%2C%22path%22%3A%22%2Fblog%2F%3Auid%2Ffoo.html%22%7D%2C%7B%22type%22%3A%22blog_home%22%2C%22path%22%3A%22%2F%22%7D%5D)

You can notice that the result url is without the `.html`, although it is included in the requested url:

```auto
routes=[{"type":"post","path":"/blog/:uid/foo.html"}]

```

---

<div class="post-metadata">

**Author:** ![Pau](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/pau/32/5422_2.png) [@Pau](https://community.prismic.io/u/Pau)\
**Post date:** [November 4, 2022, 12:18am UTC](https://community.prismic.io/t/routes-with-suffix/11546/2 "2022-11-04T00:18:41Z")

</div>

Hello team. Could you tell us a bit more about your use case?  
Why do you need to add this suffix to the routes?  
I'd think that the browser skips because it reads it as a regex

---

<div class="post-metadata">

**Author:** ![engineering3](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/engineering3/32/5215_2.png) [@engineering3](https://community.prismic.io/u/engineering3)\
**Post date:** [November 4, 2022, 6:50am UTC](https://community.prismic.io/t/routes-with-suffix/11546/4 "2022-11-04T06:50:07Z")

</div>

Hi @Pau, in our framework we allow our integrators to register routes with an `.html` prefix, based on the same principals as [Path-to-RegExp](http://forbeslindesay.github.io/express-route-tester/).

We have clients that integrate with multiple different systems (eg; Magento, BigCommerce, Prismic, etc...) and they previously have been using `.html` in their paths and would like to continue in doing so, this will avoid any requirement for unnecessary redirects. We also have clients migrating to Prismic that require this.

> I'd think that the browser skips because it reads it as a regex

I don't believe it is related to the browser, the routes I posted there is straight from the query made to Prismic, and you will notice the response data is without the `html`, it might require some special markup/escape to include the point in before the html?

 ![image](https://europe1.discourse-cdn.com/flex013/uploads/prismic/original/2X/8/8d7e602e9c76d7c32352e63747b1e232ad6e2ea8.png)

Paul @ Front-Commerce

---

<div class="post-metadata">

**Author:** ![engineering3](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/engineering3/32/5215_2.png) [@engineering3](https://community.prismic.io/u/engineering3)\
**Post date:** [November 9, 2022, 5:56pm UTC](https://community.prismic.io/t/routes-with-suffix/11546/5 "2022-11-09T17:56:01Z")

</div>

We currently had to hack something into our system to get this to work, we created a path serializer, and apply it any time a path is registered with the prismic client, and then we deserialize any paths we receive from the client 🙁

But this is only a hack, and I do hope it will be fixed, or a solution will be made available.

```auto
// This is a hack to support `.html`, see https://community.prismic.io/t/routes-with-suffix/11546
export const DOT_PLACEHOLDER = "/ ____DOT____";

export default class PrismicPath {
  /**
   * Replaces all dots in the path with a placeholder.
   *
   * see: https://community.prismic.io/t/routes-with-suffix/11546
   *
   * #### Example
   *
   * - before: `/my/path.html`
   * - after: `/my/path/ ____DOT____ html`
   *
   * @param {string} path
   * @returns {string}
   */
  static serialize(path) {
    return path.replaceAll(".", DOT_PLACEHOLDER);
  }

  /**
   * Replaces all dot placeholders in the path with a dot.
   *
   * see: https://community.prismic.io/t/routes-with-suffix/11546
   *
   * #### Example
   *
   * - before: `/my/path/ ____DOT____ html`
   * - after: `/my/path.html`
   *
   * @param {string} path
   * @returns {string}
   */
  static deserialize(path) {
    return path.replaceAll(DOT_PLACEHOLDER, ".");
  }
}

```

---

<div class="post-metadata">

**Author:** ![Pau](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/pau/32/5422_2.png) [@Pau](https://community.prismic.io/u/Pau)\
**Post date:** [November 9, 2022, 6:57pm UTC](https://community.prismic.io/t/routes-with-suffix/11546/6 "2022-11-09T18:57:21Z")

</div>

Thanks for sharing your use case and solution. I'll share this information with the dev team.

---

<div class="post-metadata">

**Author:** ![engineering3](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/engineering3/32/5215_2.png) [@engineering3](https://community.prismic.io/u/engineering3)\
**Post date:** [November 15, 2022, 4:58pm UTC](https://community.prismic.io/t/routes-with-suffix/11546/8 "2022-11-15T16:58:09Z")

</div>

Hi @Pau,

Could you have any feedback from the dev team?  
Any idea of an ETA of the API supporting this use case?

Thanks.

---

<div class="post-metadata">

**Author:** ![Pau](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/pau/32/5422_2.png) [@Pau](https://community.prismic.io/u/Pau)\
**Post date:** [November 15, 2022, 5:02pm UTC](https://community.prismic.io/t/routes-with-suffix/11546/9 "2022-11-15T17:02:57Z")

</div>

We have no news for the moment. We'll post an update if we do.  
Thanks
