change default post url from window.location.href to window.location.origin + window.location.pathname

README.md

@@ -3,7 +3,7 @@
 Remark42 is a self-hosted, lightweight, and simple (yet functional) comment engine, which doesn't spy on users. It can be embedded into blogs, articles or any other place where readers add comments.
 
 * Social login via Google, Facebook, GitHub and Yandex
-* Login via email 
+* Login via email
 * Optional anonymous access
 * Multi-level nested comments with both tree and plain presentations
 * Import from Disqus and WordPress
@@ -339,7 +339,25 @@ Add this snippet to the bottom of web page:
                           //     - 'embed': basic comments widget
                           //     - 'last-comments': last comments widget, see `Last Comments` section below
                           //     - 'counter': counter widget, see `Counter` section below
-    url: 'PAGE_URL', // optional param; if it isn't defined window.location.href will be used
+    url: 'PAGE_URL', // optional param; if it isn't defined
+                     // `window.location.origin + window.location.pathname` will be used,
+                     //
+                     // Note that if you use query parameters as significant part of url
+                     // (the one that actually changes content on page)
+                     // you will have to configure url manually to keep query params, as
+                     // `window.location.origin + window.location.pathname` doesn't contain query params and
+                     // hash. For example default url for `https://example/com/example-post?id=1#hash`
+                     // would be `https://example/com/example-post`.
+                     //
+                     // The problem with query params is that they often contain useless params added by
+                     // various trackers (utm params) and doesn't have defined order, so Remark treats differently
+                     // all this examples:
+                     // https://example.com/?postid=1&date=2007-02-11
+                     // https://example.com/?date=2007-02-11&postid=1
+                     // https://example.com/?date=2007-02-11&postid=1&utm_source=google
+                     //
+                     // If you deal with query parameters make sure you pass only significant part of it
+                     // in well defined order
     max_shown_comments: 10, // optional param; if it isn't defined default value (15) will be used
     theme: 'dark', // optional param; if it isn't defined default value ('light') will be used
     page_title: 'Moving to Remark42' // optional param; if it isn't defined `document.title` will be used
@@ -445,7 +463,7 @@ You can use as many nodes like this as you need to.
 The script will found all them by the class `remark__counter`,
 and it will use `data-url` attribute to define the page with comments.
 
-Also script can uses `url` property from `remark_config` object, or `window.location.href` if nothing else is defined.
+Also script can use `url` property from `remark_config` object, or `window.location.origin + window.location.pathname` if nothing else is defined.
 
 ## Build from the source
 
@@ -681,7 +699,7 @@ event: info
 data: {"url":"https://radio-t.com/blah1","count":8,"first_time":"2019-06-18T12:53:48.125686-05:00","last_time":"2019-06-18T12:53:48.23817-05:00"}
 
 event: info
-data: {"url":"https://radio-t.com/blah1","count":9,"first_time":"2019-06-18T12:53:48.125686-05:00","last_time":"2019-06-18T12:53:48.254669-05:00"}         
+data: {"url":"https://radio-t.com/blah1","count":9,"first_time":"2019-06-18T12:53:48.125686-05:00","last_time":"2019-06-18T12:53:48.254669-05:00"}
 ```
 
 </details>

frontend/app/counter.ts

@@ -37,7 +37,7 @@ async function init(): Promise<void> {
   }
 
   const map = nodes.reduce<{ [key: string]: HTMLElement[] }>((acc, node) => {
-    const id = node.dataset.url || remark_config.url || window.location.href;
+    const id = node.dataset.url || remark_config.url || window.location.origin + window.location.pathname;
     if (!acc[id]) acc[id] = [];
     acc[id].push(node);
     return acc;

frontend/app/embed.ts

@@ -38,7 +38,7 @@ async function init(): Promise<void> {
     return;
   }
 
-  remark_config.url = (remark_config.url || window.location.href).split('#')[0];
+  remark_config.url = (remark_config.url || window.location.origin + window.location.pathname).split('#')[0];
 
   (window as any).REMARK42 = (window as any).REMARK42 || {};
   (window as any).REMARK42.changeTheme = changeTheme;