Localisation with App Proxy

kevin_mittal
Shopify Partner
10 0 7

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.

Replies 36 (36)

SBD_
Shopify Staff
1829 269 405

-- 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

 

 

Scott | Developer Advocate @ Shopify 

jagmelis
New Member
4 0 0

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
New Member
4 0 0

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_
Shopify Staff
1829 269 405

Thanks @jagmelis 

 

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

Scott | Developer Advocate @ Shopify 

jagmelis
New Member
4 0 0

 Hi @SBD_ ,

 

Thanks for your response.

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

jagmelis
New Member
4 0 0

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_
Shopify Staff
1829 269 405

Hey @jagmelis 

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

Scott | Developer Advocate @ Shopify 

Andrew-W
Shopify Partner
27 3 14

Hi @SBD_,

 

Any update on this?

 

Thanks!

Andrew

FrankieB
Tourist
5 0 2

Hi Scotty,

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

Marc_Mayr
Shopify Partner
71 1 10

@SBD_ 

We are facing the same problem. Please keep us updated

Andrew-Corknine
Explorer
76 1 29

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

SBD_
Shopify Staff
1829 269 405

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

Scott | Developer Advocate @ Shopify 

Marc_Mayr
Shopify Partner
71 1 10

@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_
Shopify Staff
1829 269 405

@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

 

Scott | Developer Advocate @ Shopify 

Marc_Mayr
Shopify Partner
71 1 10

@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_
Shopify Staff
1829 269 405

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

Scott | Developer Advocate @ Shopify 

_Dominik_
Shopify Partner
31 0 11

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_
Shopify Staff
1829 269 405

@_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.

Scott | Developer Advocate @ Shopify 

AvocadosLab
Shopify Partner
51 4 44

@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_
Shopify Staff
1829 269 405

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

 
 

Scott | Developer Advocate @ Shopify 

shopapps
Visitor
1 0 0

@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_
Shopify Staff
1829 269 405

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.

Scott | Developer Advocate @ Shopify 

FrankieB
Tourist
5 0 2

Hi @SBD_ 

Still no news on the progress of the actual fix?

 

SBD_
Shopify Staff
1829 269 405

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

Scott | Developer Advocate @ Shopify 

Marc_Mayr
Shopify Partner
71 1 10

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

FrankieB
Tourist
5 0 2

1 month has passed again....

Marc_Mayr
Shopify Partner
71 1 10

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_
Shopify Staff
1829 269 405

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.

Scott | Developer Advocate @ Shopify 

FrankieB
Tourist
5 0 2

bump

SBD_
Shopify Staff
1829 269 405

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 🙏

Scott | Developer Advocate @ Shopify 

YupanaEngineer
Shopify Partner
12 0 0

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
Shopify Partner
9 0 2

Hi,

Was that feature reverted?

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

SBD_
Shopify Staff
1829 269 405

Hi @Nicola_Bizzoca,

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

Scott | Developer Advocate @ Shopify 

Nicola_Bizzoca
Shopify Partner
9 0 2

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
Shopify Expert
81 1 32

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
Shopify Partner
51 4 44

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.