How to force / set locale in PDF.js

Question

I'm upgrading from an old version of PDF.JS (1.9.426) to the latest stable (2.5.207).

Previously, it was very simple to force the locale to match your applications current locale. You simply pass it through as a parameter in the URL; /PDFJS/web/viewer.html?file=example.pdf #locale=zh-CN

However, on upgrading, I see that this is no longer recommended. This is despite the documentation still mentioning it.

In my application, users can override their prefered locale, so it might not match the browser.

I've looked into embed / object, which seemed like the solution, until I realised Android browsers don't support embedded PDF viewing.

I've been searching for the correct way to implement this, and so far I've not found a good or recommended answer. It seems PDF.js is still the best all round solution, but I can't figure out the correct way of using it to simply render an existing PDF into a div.

From what I can tell the developers simply removed the option, didn't upgrade the docs, and are recommending to hard code the locale in viewer.js (which to me, kind of defeats the point).

I'm hoping someone can point me in the correct direction, and possibly help others who come across this.

Answer 1

For anyone looking to just get this working (until a better answer comes along), heres a fix;

Find the method "_initializeL10n" in viewer.js (line 552 in v2.5.207);

async _initializeL10n() {
    this.l10n = this.externalServices.createL10n({
        locale: _app_options.AppOptions.get("locale")
    });
    const dir = await this.l10n.getDirection();
    document.getElementsByTagName("html")[0].dir = dir;
}

Change it to this;

async _initializeL10n() {
    var hash = document.location.hash.substring(1);
    var hashParams = (0, _ui_utils.parseQueryString)(hash);
    this.l10n = this.externalServices.createL10n({
        locale: ('locale' in hashParams) ? hashParams['locale'] : _app_options.AppOptions.get("locale")
    });
    const dir = await this.l10n.getDirection();
    document.getElementsByTagName("html")[0].dir = dir;
}

This takes the code we need from the old version and gets #locale= working.

I hope to be told the correct way of doing it at some point.