# Example code for converting URL generated by "Concatenate" to URL of "Replace (Backward compatibility mode)" specification

As announced on March 01, 2021, Replace (Backward compatibility mode) in Method for converting additional information in the LIFF URL on the LINE Developers Console is no longer available. All LIFF and LINE MINI App URLs will now open with Concatenate.

However, if you want to transition to a secondary redirect URL based on the Replace (Backward compatibility mode) specification, even after you migrate your LIFF app or LINE MINI App to Concatenate, you need to incorporate the following functions into your LIFF app or LINE MINI App.

Read only if you want to generate a secondary redirect URL based on "Replace (Backward compatibility mode)"

Method for converting additional information in the LIFF URL has been forcibly migrated to Concatenate on March 1, 2021. Below is information prior to the change on generating a secondary redirect URL in the same way as Replace (Backward compatibility mode). If your app has already migrated to Concatenate, no action listed on this page is required.

Also, we are providing this page as a temporary solution for discontinuation of Replace (Backward compatibility mode) and are not actively recommending to use the code. The most consistent and reliable solution is to correctly migrate your LIFF app to Concatenate. The code provided on this page doesn't solve all the problems that may occur due to the discontinuation of Replace (Backward Compatibility Mode). Use the code at your own risk according to the characteristics of your LIFF app and LINE MINI App.

This page is available for a limited time only

This page is intended to support the migration to Concatenate, due to the discontinuation of Replace (Backward compatibility mode). Some time after the discontinuation of Replace (Backward compatibility mode), we may delete this page. If you wish to check the conversion method even after this page is deleted, download the function that converts secondary redirect URL generated by "Concatenate", and refer to the code as necessary.

When you use the conversion code

# Function that converts secondary redirect URL generated by "Concatenate"

Executing this JavaScript function, convertUrlFromConcatToReplace, on the secondary redirect URL page based on the Concatenate specification, allows the user to obtain a URL based on the Replace (Backward compatibility mode) specification when the user transitions to a secondary redirect URL generated by Concatenate.

When executing the function, you don't need to load the LIFF SDK or execute liff.init().

function convertUrlFromConcatToReplace(concatenateModeUrl, endpointUrl) {
  if (!concatenateModeUrl || !endpointUrl) {
    throw new TypeError('`concatenateModeUrl` and `endpointUrl` are required');
  }
  const concatenateURL = new URL(concatenateModeUrl);
  const endpointURL = new URL(endpointUrl);
  const {
    pathname: concatenateModeUrlPathname,
    searchParams: concatenateModeUrlSearchParams,
  } = concatenateURL;
  const {
    pathname: endpointUrlPathname,
    searchParams: endpointUrlSearchParams,
  } = endpointURL;
  concatenateURL.pathname = concatenateModeUrlPathname.replace(
    endpointUrlPathname,
    '',
  );
  const concatenateModeUrlSearchParamsEntries = [
    ...concatenateModeUrlSearchParams.entries(),
  ];
  let endpointUrlSearchParamsEntries = [...endpointUrlSearchParams.entries()];
  const newSearchParamsEntries = concatenateModeUrlSearchParamsEntries.reduce(
    (ret, entry) => {
      const index = endpointUrlSearchParamsEntries.findIndex(
        ([key, val]) => key === entry[0] && val === entry[1],
      );
      if (index !== -1) {
        endpointUrlSearchParamsEntries = endpointUrlSearchParamsEntries.filter(
          (_, i) => i !== index,
        );
        return ret;
      }
      return [...ret, entry];
    },
    [],
  );
  [...concatenateModeUrlSearchParams.keys()].forEach((key) => {
    concatenateModeUrlSearchParams.delete(key);
  });
  newSearchParamsEntries.forEach(([k, v]) => {
    concatenateModeUrlSearchParams.append(k, v);
  });
  const url = concatenateURL.toString();
  return url;
}

# Execute function

You can redirect the user to a URL based on the Replace (Backward compatibility mode) specification by executing this function:

location.href = convertUrlFromConcatToReplace(location.href, "https://example.com/your_endpoint_url")

# Possible Scenarios

In these scenarios, the Function that converts secondary redirect URL generated by "Concatenate" converts a secondary redirect URL based on the Concatenate specification to one based on the Replace mode specification.

# Scenario 1: Endpoint URL and LIFF URL include a path

Endpoint URL and LIFF URL each include a path (/path).

Example URL:

  • Endpoint URL: https://example.com/path_A
  • LIFF URL: https://liff.line.me/{liffId}/path_B

# Scenario 2: Endpoint URL includes a query parameter, LIFF URL includes a path

Endpoint URL includes a query parameter (?key=value), and LIFF URL includes a path (/path).

Example URL:

  • Endpoint URL: https://example.com/?key_A=value
  • LIFF URL: https://liff.line.me/{liffId}/path_A

# Scenario 3: Endpoint URL includes path, LIFF URL includes query parameter

Endpoint URL includes a path (/path), and LIFF URL includes query parameter (?key=value).

Example URL:

  • Endpoint URL: https://example.com/path_A
  • LIFF URL: https://liff.line.me/{liffId}/?key_A=value

# Scenario 4: Endpoint URL, LIFF URL have different paths and query parameters

Endpoint URL and LIFF URL have different paths and query parameters (/pathA?key_A=value).

Example URL:

  • Endpoint URL: https://example.com/path_A?key_A=value
  • LIFF URL: https://liff.line.me/{liffId}/path_B?key_B=value

# Scenario 5: Endpoint URL and LIFF URL have the same path and query parameter

Endpoint URL and LIFF URL have the same path and query parameter (/pathA?key_A=value).

Example URL:

  • Endpoint URL: https://example.com/path_A?key_A=value
  • LIFF URL: https://liff.line.me/{liffId}/path_A?key_A=value

# URL conversion logic

Function that converts secondary redirect URL generated by "Concatenate" performs the following:

Endpoint URL + Path generated from "Concatenate" - Path of endpoint URL + Query parameter generated from "Concatenate" - Query parameter of endpoint URL = Secondary redirect URL generated from "Replace (Backward compatibility mode)"

# Example from performing URL conversion logic

Deploying the URL conversion logic leads to the following URL conversions per scenario:

Scenario Endpoint URL LIFF URL Secondary redirect URL before URL conversion Secondary redirect URL after URL conversion
1 https://example.com/path_A https://liff.line.me/{liffId}/path_B https://example.com/path_A/path_B https://example.com/path_B
2 https://example.com/?key_A=value https://liff.line.me/{liffId}/path_A https://example.com/path_A?key_A=value https://example.com/path_A
3 https://example.com/path_A https://liff.line.me/{liffId}/?key_A=value https://example.com/path_A?key_A=value https://example.com/?key_A=value
4 https://example.com/path_A?key_A=value https://liff.line.me/{liffId}/path_B?key_B=value https://example.com/path_A/path_B?key_A=value?key_B=value https://example.com/path_B?key_B=value
5 https://example.com/path_A?key_A=value https://liff.line.me/{liffId}/path_A?key_A=value https://example.com/path_A/path_A?key_A=value?key_A=value https://example.com/path_A?key_A=value

# Download the function that converts secondary redirect URL generated by "Concatenate"

Download the function that converts secondary redirect URL generated by "Concatenate" from here.

Host the script file on the server

Download the script file and host it on your server instead of loading the above download link address directly from your LIFF app or LINE MINI App.