Many of you asked me a lot of times about getting rid of the 'm' parameter from blogger blog url. Even though there is no problem with this parameter, people want to remove it from the url.
Currently there is no native way to remove it, but there is a workaround to do this. Using Cloudflare Workers as middleware, we can modify the response before it reaches to user. What we can do is detect the device type (i.e. 'mobile', 'tablet' or 'desktop') using 'User-Agent' request header and fetch the origin with 'm' parameter with value '1' if the request comes from a mobile or tablet devices and send it back to the user. By doing this, user will no longer get redirected to the url with 'm' parameter when visited on mobile or tablet devices.
This process requires Custom domain routed to a Cloudflare Workers which means you need a Custom Domain integrated with Cloudflare. Therefore, we can't do the same for .blogspot subdomain.
Limitations
Before we begin, you must be aware about Cloudflare Workers Limits. If you hit these limits, the site will not be accessible. To solve this issue, you may consider switching to Paid plan.
Requirements
Before we start, there are several things which must be required:
- DNS must be managed by Cloudflare (Note: Proxy must be enabled).
Creating Workers in Cloudflare
- Login to your Cloudflare Account.
- Go to Workers & Pages section and click on Create application.
- Go to Workers tab and click on Create Worker and rename the worker as
remove-m-worker
. - Click on Deploy as we shall be able to edit code after deploying "Hello World!" worker.
-
Now click on Edit code and replace the existing code with the following code:
/** * Environment interface * * @typedef Env * @property {string} my_var */ // constants const MOBILE_REGEX = /(?:phone|windows\s+phone|ipod|blackberry|(?:android|bb\d+|meego|silk|googlebot) .+? mobile|palm|windows\s+ce|opera\ mini|avantgo|mobilesafari|docomo|KAIOS)/i; const TABLET_REGEX = /(?:ipad|playbook|(?:android|bb\d+|meego|silk)(?! .+? mobile))/i; /** * A helper function to get the device type from user-agent * * @param {string | null} userAgent * * @returns {"mobile" | "tablet" | "desktop"} */ const getDeviceType = (userAgent) => { if (typeof userAgent === "string") { if (MOBILE_REGEX.test(userAgent)) { return "mobile"; } if (TABLET_REGEX.test(userAgent)) { return "tablet"; } } // Everything else not matched above will be considered as desktop return "desktop"; } /** * An object with workers handlers * * @type {ExportedHandler<Env>} */ const worker = { async fetch(request, env, context) { // Get the device type from user-agent header const deviceType = getDeviceType(request.headers.get("User-Agent")); const proxiedUrl = new URL(request.url); // Set the search param 'm' with value '1' if the device type is not 'desktop' if (deviceType !== "desktop") { proxiedUrl.searchParams.set("m", "1") } const proxiedRequest = new Request(proxiedUrl, { method: request.method, body: request.body, headers: request.headers, redirect: "follow" }); const proxiedResponse = await fetch(proxiedRequest); const response = new Response(proxiedResponse.body, proxiedResponse); // OPTIONAL: You can further modify the response here :) return response; } } // Export handlers export default worker;
- Click on Save and Deploy.
Creating Routes
- Go to Websites section in Cloudflare Dashboard and select your domain.
- Now go to Workers Routes section and then click on Add Route.
-
Input the fields as shown in the given table:
Route Service Environment www.fineshopdesign.com/*
remove-m-param
production
-
*Input the fields as per your blog url and workers name.
You can route any subdomain which are hosted on Blogger to this workers in order to remove the 'm' parameter from querystring.