Localisation with App Proxy

[kevin_mittal]

Hello,

Is there any way to use localised URLs with App Proxy?

For an instance, a store with multiple active locale will have;

https://abc.myshopify.com/products/handle (default)

https://abc.myshopify.com/fr-CA/products/handle (fr-CA)

However, for an App Proxy, the same isn't working;

https://abc.myshopify.com/tools/my-app (working)

https://abc.myshopify.com/fr-CA/tools/my-app (not working)

Is there anyway to render locale specific data within App Proxy liquid files? Currently, request.locale is always returning shop's primary locale within App Proxy.

Looking forward to a solution 🙂

Thank you.

[SBD_]

-- Updated Feb 2020 --

Hey @kevin_mittal,

Localised URLs now work with app proxies. The language is passed along in the accept-language header.

/es/apps/example -> accept-language: es;q=1.0, en;q=0.5

[jagmelis]

Hi Scotty,

I have the same problem with our "custom app" (proxy app).

I can confirm I'm receiving the "accept-language"-header,

but this doesn't contain the published languages from our shop.

It looks like it sends the languages from the clients-browser...

Published languages in our shop:

English = default, German and French

Received languages header in proxy app:

Chrome: [HTTP_ACCEPT_LANGUAGE] => nl,nl-NL;q=0.9,en;q=0.8,en-US;q=0.7,de;q=0.6,fr;q=0.5,sv;q=0.4,it;q=0.3,lb;q=0.2,da;q=0.1,la;q=0.1,es;q=0.1
IE edge: [HTTP_ACCEPT_LANGUAGE] => nl-NL,nl;q=0.8,en-GB;q=0.5,en;q=0.3

A much bigger issue for me is that front-end isn't accepting localised URL's;

So:

- myshop.com/apps/customapp > is working

- myshop.com/de/customapp > isn't working (404)

(I've already re-installed the app, and made sure that "read_locales" and "read_translations" are in the app scopes).

Can you please advise?

[jagmelis]

In my question above I made one mistake in the explanation...

And to be sure the problem is clear;

- myshop.com/apps/customapp > is working

- myshop.com/de/apps/customapp > isn't working (404)

- myshop.com/nl/apps/customapp > isn't working (404)

- myshop.com/fr/apps/customapp > isn't working (404)

So at this moment Shopify doesn't point the localised urls to my proxy app.

[SBD_]

Thanks @jagmelis 

We had to roll back the proxy locale fix, a new fix should be deployed soon. Keep you posted.

[jagmelis]

 Hi @SBD_ ,

Thanks for your response.

I hope it will be implemented soon, as the deadline for our multilingual store is April 14th.

[jagmelis]

Hi @SBD_  and @Jordan (Jordan Valenzuela),

Any news on this?

I have a feeling it doesn't look very promising at this moment.

And while my boss is breathing on my neck and the 14th of April is approaching very soon, I'll guess I have to fall back on the Dutch Saying...

"sticking bicycle tires" ?

Please keep me posted if you have any news.

Kind regards,

Jeroen

[SBD_]

Hey @jagmelis 

The fix is being reviewed - unfortunately there's no ETA, keep you posted.

[Andrew-W]

Hi @SBD_,

Any update on this?

Thanks!

Andrew

[FrankieB]

Hi Scotty,

Any news? Could you give us an update on this matter?

[Marc_Mayr]

@SBD_ 

We are facing the same problem. Please keep us updated

[Andrew-Corknine]

Also facing this issue.  Is that an ETA for a fix that allows app proxies in translated routes?

[SBD_]

Nothing to report yet. I'll update this thread as soon as there's news.

[Marc_Mayr]

@SBD_ sorry to stress but we kinda moved our Shop over from Magento 2 recently and now all of our spanish/italian/portoguese/danish/norwegian/swedish/polish customers have to use the shop in English which lead to a significant drop in our conversion rate.
It's because our product pages are implemented through an app proxy (as it's a customized product)

Would appreciate if you could give a rough estimate when this can be fixed

[SBD_]

@Marc_Mayr sorry I'm unable to provide an ETA. Are you able to use a workaround for the time being? Here are two approaches:

1. Parse the language from the headers. For example proxied requests should contain a referer header:

Referer: https://shop.com/es/products/some-product

2. Use JS to attach the language as a query parameter:

/app/example?language=es

[Marc_Mayr]

@SBD_ we tried this one but once you select Spanish on the home page and then visit /app/product?language=es ( without /es/ ) it redirects to /es/product?language=es which leads to a  404
I guess because Shopify sets a cookie so it always squeezes in the language /es/ in the URL once a customer has set this language. Which makes sense

[SBD_]

@Marc_Mayr can you please DM me a link to an example?

[_Dominik_]

Hi @SBD_ we tried both those methods you described and more, nothing worked

• Parameter ?language=de
• Parameter ?locale=de
• Request Header Accept-Language: de
• Referer

How can we render translated content via liquid through an app proxy?

Is there a workaround that should work?

Thanks for your help.

[SBD_]

@_Dominik_ the work arounds will only allow you to translate content returned by the proxy, not the entire theme.

For example, /apps/proxy-url?language=es will proxy to your URL with a language parameter.

[AvocadosLab]

@SBD_ any update around this?

I'm also having trouble showing my app contents over app proxy when merchants have translations apps that serve content by changing URL (ex. /fr, /de)

[SBD_]

@AvocadosLab No. I'll update this thread as soon as there's news.

[shopapps]

@SBD_

We tried the workaround you suggested and managed to get the language.

One issue we are facing is. When we render the app proxy page response/HTTP response, we set Content-Type to application/liquid. Menu links render without the language URL.

Anyway we can set the Language of the Proxy response/HTTP response. so that resulting Liquid knows the language to use.

Thanks!

[SBD_]

We tried the workaround you suggested and managed to get the language.

Good to know!

One issue we are facing is. When we render the app proxy page response/HTTP response, we set Content-Type to application/liquid. Menu links render without the language URL.

Yep, that's where this workaround will fail.

[FrankieB]

Hi @SBD_ 

Still no news on the progress of the actual fix?

[SBD_]

@FrankieB Not yet. I'll update this thread as soon as there's news.

[Marc_Mayr]

Desperately waiting for a fix on this 😞 Is there at least an ETA? 1 month, 2 months, 6 months, a year?

[FrankieB]

1 month has passed again....

[Marc_Mayr]

We'd really need an ETA on this so we know if we should work on a hotfix or wait till you fix the problem.
Please don't leave us in the dark @SBD_ 

[SBD_]

Hey @Marc_Mayr

The folks handling this fix are aware of the demand and I'm following up often. I'm unable to obtain an ETA at this point. I'll post here as soon as there's progress or an ETA.

[FrankieB]

bump

[SBD_]

Hey everyone,

This just shipped. Testing on a demo store:

/apps/example -> accept-language: en
/es/apps/example -> accept-language: es, en;q=0.5

Sorry for the wait. Thanks for your patience 🙏

[YupanaEngineer]

Hello

How can we get the real browser's language?

Store language set to French

Browser Request
HTTP_ACCEPT_LANGUAGE: en,en-US;q=0.9

App Proxy:
HTTP_ACCEPT_LANGUAGE: fr, en;q=0.5

Proxy overrides HTTP_ACCEPT_LANGUAGE but there is no alternative Server Request field to retrieve the original language such as HTTP_X_FORWARDED_ACCEPT_LANGUAGE?

[Nicola_Bizzoca]

Hi,

Was that feature reverted?

Urls like /es/apps/example started to answer with 404

[SBD_]

Hi @Nicola_Bizzoca,

Still working on my end - can you confirm the store has `es` language published in Settings > Store Languages?

[Nicola_Bizzoca]

Thank you for your message

It stopped working for about 12h for only then working again

Seems like it was some code change deploied on the Shopify side that broke that functionality

Now it's back to working

[amosmos]

Hey @SBD_ 

Thanks for the work on this!

Can you explain the language field format? Why is it "es, en;q=0.5" for spanish? I mean what is the "en" doing there? Why it is not "es" or even "es-ES" which is ideal (meaning with the country code)?

Thanks,

Amos

[AvocadosLab]

Found a major issue with this localization feature. 

When you have multilingual store with say "fr" & "es" with "es" being your primary language and you are currently on "fr" language with URL "domain.com/fr". When you navigate to a page created through app proxy, shopify locale changes to primary language "es" instead of staying "fr".

This seems to be a bug in Shopify navigation as app proxy pages are dependent on "accept-language" request header which is reverting back to primary language "es" instead of staying "fr".

Because of this language reset, apps fail to show content in proper language. This reset happens before even hitting app so we can't do anything about it and we are solemnly acting based on what we receive in "accept-language" header. This happens only when you are navigating from other page to app proxy page. When you change language on app proxy page, it works as expected.