App Proxy downloading file instead of rendering liquid

Conjured_Char
Shopify Partner
36 0 4

I'm building an embedded app and trying to get the App Proxy option to render a liquid page to work. I have set up the proxy correctly in the app, and have the file returning a "Content-Type: application/liquid" header, but when I access the page in my test store, it simply downloads the file. 

Here's the contents of the file:

<?php

header("Content-Type: application/liquid");

?>
<h1>hello world</h1>

The headers are being sent correctly - any ideas why the page isn't rendering? Are there additional headers that need to be set to make this work? 

Thanks in advance.

 

Replies 7 (7)

Conjured_Char
Shopify Partner
36 0 4

Quick update. I have it working if the file is on a different server. The server configurations are different so I'm trying to narrow down what configuration issue is causing the problem. 

Here are the headers output by the server that *isn't* working:

HTTP/1.1 200 OK 
Date: Sat, 30 Apr 2016 17:13:57 GMT 
Server: Apache/2.4.7 (Ubuntu) 
X-Powered-By: PHP/5.5.9-1ubuntu4.14 
Content-Length: 21 
Content-Type: application/liquid

And the headers for the output by the server that *is* working:

HTTP/1.1 200 OK 
Date: Sat, 30 Apr 2016 17:13:57 GMT 
Server: Apache/2.2.22 
X-Powered-By: PHP/5.3.29 
Vary: User-Agent 
Transfer-Encoding: chunked 
Content-Type: application/liquid

 

Conjured_Char
Shopify Partner
36 0 4

Wow, ok, after a great many hours troubleshooting, I fixed this issue. It had to do with a directive I had in my htaccess file. Specifically, it looked like:

# Redirect Trailing Slashes...
RewriteRule ^(.*)/$ /$1 [L,R=301]

Changing it to the following made the proxy work as expected:

# Redirect Trailing Slashes...
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)/$ /$1 [L,R=301]

Note also that if you're not requesting a file (ex: test.php in my case), but using a directory (ex: http://yourdomain.com/test) that the request to the server includes the trailing slash (meaning that Shopify's proxy requests http://yourdomain.com/test/). The htaccess file issues a 301 redirect, which is forcing Shopify to download the file instead of interpret it as liquid. To fix that issue, you might add another rewrite condition that excludes those domains from being redirect to their "non-trailing-slash" counterparts.

Josh_Brown1
Shopify Staff (Retired)
146 0 28

Thanks for posting your solution here in the forums for others 🙂

To learn more visit the Shopify Help Center or the Community Blog.

Farbod_Taheri
Visitor
1 0 0

Okay, I needed to read that carefully a few times and the comment on trailing slashes makes sense to me now. Also, for testing clearing the browser cache is required to see the desired result.

OneMangaTwoMang
New Member
12 0 0

Hi Charlotte,

I'm having the same issue with my file being served for download instead of rendering the liquid code.  However, my embedded app is hosted on Heroku, which means I don't have access to a .htaccess file.  Any suggestions?

Lenin1
Shopify Partner
3 0 0

Hey OneMangaTwoManga, 

I know this reply is very late, but I recently encountered this issue when attempting to set up my app hosted on Heroku. 

The issue seems to be that some servers, including Heroku, seem to have some settings that creates a file for download instead of passing the response back to Shopify for rendering. Like Charlotte indicated, this has to do with the settings in the htaccess file. If you have the ability to edit these settings, then this issue should get resolved by following the steps she outlined. 

In Heroku, I was able to follow the instructions here to correct this issue. https://devcenter.heroku.com/articles/custom-php-settings 

By providing an apache_app.conf file, I was able to alter the rewrite rules and correct this issue. 

Jeff_S_
Tourist
7 0 1

I also had this issue.  It isn't exactly clear what I did to resolve it.  However after it had been resolved Shopify seemed to be serving me a cached page in my browser which prevented me from realizing it was resolved for quite some time.

If you are accessing a Proxy URL and you want to test your fix is in place, try appending something unique to the query string to allow for a fresh test.

Clearing your cache may also work.