HTML page not interpreted as UTF-8 when using SSI</a></h1> </div> <div class="grid fw-wrap pb8 mb16 bb bc-black-075"> <div class="grid--cell ws-nowrap mr16 mb8" title="2016-01-12 19:07:53Z"> <span class="fc-light mr2">Asked</span> <time itemprop="dateCreated" datetime="2014-01-15T14:49:07.563" class="fromnow">Jan 15 '14 at 14:49</time> </div> <div class="grid--cell ws-nowrap mr16 mb8"> <span class="fc-light mr2">Active</span> <time class="fromnow" title="2014-05-10T13:36:25.567" datetime="2014-05-10T13:36:25.567">May 10 '14 at 13:36</a> </div> <div class="grid--cell ws-nowrap mb8" title="Viewed 1,571 times"> <span class="fc-light mr2">Viewed</span> 1,571 times </div> </div> <div id="mainbar" role="main" aria-label="questions and answers"> <div id="question" class="question" data-questionid="21140548" data-ownerid="1961494" data-score="3"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="21140548"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="3">3</div> <button class="js-bookmark-btn s-btn s-btn__unset c-pointer py4"> <svg aria-hidden="true" class="svg-icon iconBookmark" width="18" height="18" viewBox="0 0 18 18"><path d="M6 1a2 2 0 00-2 2v14l5-4 5 4V3a2 2 0 00-2-2H6zm3.9 3.83h2.9l-2.35 1.7.9 2.77L9 7.59l-2.35 1.7.9-2.76-2.35-1.7h2.9L9 2.06l.9 2.77z"></path></svg> <div class="js-bookmark-count mt4" data-value="0">0</div> </button> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p>To make my website look-and-feel consistent, I heavily use SSI. All my pages have the same header (save for the title) and footer. These act like templates and are included with an SSI directive. Variable field content is provided throug SSI #set-variables.</p> <p><em>This is the nearest equivalent to "functions" I found without resorting to HTML generators.</em></p> <p>A standard page structure is as follows:</p> <pre><code><!--#set var="PageTitle" value="Référence" --> <!--#include virtual="/header.shtml" --> <section> Specific page content </section> <!--#include virtual="/footer.shtml" --> </code></pre> <p>File <em>header.shtml</em> contains <code><!DOCTYPE > <html> <head> ... </head> <<body> <header> ... </header></code> and similarly <code><footer> ... </footer> </body> </html></code> for <em>footer.shtml</em>.</p> <p>File <em>header.shtml</em> creates the title for the page with an element:</p> <pre><code><title><!--#echo var="PageTitle" --></title> </code></pre> <p>Everything is fine as long as my title string for variable <code>PageTitle</code> contains only printable ASCII character (i.e. as long as I'm writing in English). Things become more complicated if I want to insert a title in any language using characters outside the ASCII printable set.</p> <p><em>If this string is put asis in the</em> <code><title></code> <em>element, there is no problem.</em></p> <p>As an exemple, the French word above print as <em>Référence</em>. The UTF-8 sequence \x52 \x53 \xA9 ... prints as if it were ISO-8859-x. \x53 \xA9 is the UTF-8 sequence for \xC0 + \x29 = U+00E9 LATIN SMALL LETTER E WITH ACUTE, which is the desired character.</p> <p>I have tried to use some <code>encoding=</code> attribute in the <code>#echo</code> directive, to no avail, since it affects ISO-8859-1 special characters and does not seem to understand UTF-8.</p> <p>From what I see in the HTML sent by the server, the string uses entity references for any "dubious" character:</p> <pre><code>R&#195;&#169;f&#195;&#169;rence </code></pre> <p><strong>Is there a way to put Apache SSI #echo processing in "transparent" mode?</strong></p> <p>Apache manual says <code>encoding=</code> defaults to <code>entity</code> (which I get as a result). It can also be set to <code>URL</code> to protect URLs against malicious use (i.e. % escape). But, there is no <code>none</code> setting.</p> <p><em>Of course, as a workaround, I could use directly character entity references in the string, but this is not user-friendly: it is much more comfortable to type a character which is accessible from the keyboard and having the target character on screen eases proof-reading.</em></p> <h1>Edit:</h1> <p>SOLVED!</p> <p>Solved, but I don't know if it is "standard".</p> <p>I tried adding <code>encoding="none"</code> in the offending <code>#echo</code> statement and everything went fine!</p> <p>Now, I must check if this is available across different Apache versions.</p></div> <div class="mt24 mb12"> <div class="post-taglist grid gs4 gsy fd-column"> <div class="grid ps-relative"> <a href="../../questions/tagged/apache" class="post-tag js-gps-track" title="show questions tagged 'apache'" rel="tag">apache</a> <a href="../../questions/tagged/unicode" class="post-tag js-gps-track" title="show questions tagged 'unicode'" rel="tag">unicode</a> <a href="../../questions/tagged/character-encoding" class="post-tag js-gps-track" title="show questions tagged 'character-encoding'" rel="tag">character-encoding</a> <a href="../../questions/tagged/echo" class="post-tag js-gps-track" title="show questions tagged 'echo'" rel="tag">echo</a> <a href="../../questions/tagged/ssi" class="post-tag js-gps-track" title="show questions tagged 'ssi'" rel="tag">ssi</a> </div> </div> </div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature grid--cell"> <div class="user-info "> <div class="user-action-time">edited <span title="2014-05-10T13:36:25.567" class="relativetime">May 10 '14 at 13:36</span></div> <div class="user-gravatar32"></div> <div class="user-details" itemprop="author" itemscope="" itemtype="http://schema.org/Person"> <span class="d-none" itemprop="name">ajlittoz</span> <div class="-flair"></div> </div> </div> </div> <div class="post-signature owner grid--cell"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Jan 15 '14 at 14:49">asked Jan 15 '14 at 14:49</time> <a href="../../users/1961494/ajlittoz" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/1961494.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="ajlittoz" /> </a> <div class="s-user-card--info"> <a href="../../users/1961494/ajlittoz" class="s-user-card--link">ajlittoz</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">414</li> <li class="s-award-bling s-award-bling__gold" title="1 gold badge">1</li> <li class="s-award-bling s-award-bling__silver" title="5 silver badge">5</li> <li class="s-award-bling s-award-bling__bronze" title="14 bronze badge">14</li> </ul> </div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-21140548" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="21140548" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-31816379" class="comment js-comment " data-comment-id="31816379" data-comment-owner-id="13508" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment31816379_21140548"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">How do you inspect the HTML received by the browser? Good old "View Source" feature shows the actual text but anything more advanced (esp. developer tools that display DOM trees) don't. And, how's the browser supposed to know your text is UTF-8? You don't mention anything about HTTP headers.</span> – <a href="../../users/13508/alvaro-gonzalez" title="142,137 reputation" class="comment-user ">Álvaro González</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment31816379_21140548"><span title="2014-01-15T15:17:54.053 License: CC BY-SA 3.0" class="relativetime-clean">Jan 15 '14 at 15:17</span></a></span> </div> </div> </li> <li id="comment-31819769" class="comment js-comment " data-comment-id="31819769" data-comment-owner-id="1961494" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment31819769_21140548"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">I didn't mention all the bookkeeping around; everything is the same in the "manual" and SSI version of the site (HTTP header of "Content-Type: text/html;charset=utf-8" explicitly sent before page text). Unicode UTF-8 byte sequence -> entity references occurs during #echo processing (to protect me against unintended XSS). I want to diable temporarily this transformation.</span> – <a href="../../users/1961494/ajlittoz" title="414 reputation" class="comment-user owner">ajlittoz</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment31819769_21140548"><span title="2014-01-15T16:35:03.263 License: CC BY-SA 3.0" class="relativetime-clean">Jan 15 '14 at 16:35</span></a></span> </div> </div> </li> <li id="comment-31860442" class="comment js-comment " data-comment-id="31860442" data-comment-owner-id="13508" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment31860442_21140548"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">Please use the "Answer Your Own Question" button to provide a solution. Otherwise, answers cannot be voted or accepted and question will show up as unanswered.</span> – <a href="../../users/13508/alvaro-gonzalez" title="142,137 reputation" class="comment-user ">Álvaro González</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment31860442_21140548"><span title="2014-01-16T15:04:12.633 License: CC BY-SA 3.0" class="relativetime-clean">Jan 16 '14 at 15:04</span></a></span> </div> </div> </li> <li id="comment-31905171" class="comment js-comment " data-comment-id="31905171" data-comment-owner-id="1961494" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment31905171_21140548"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">I know, but my "reputation" does not allow me yet to answer my own questions. I considered added a new comment but decided to edit my question instead. Maybe you could copy my edit as a solved answer? Regards.</span> – <a href="../../users/1961494/ajlittoz" title="414 reputation" class="comment-user owner">ajlittoz</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment31905171_21140548"><span title="2014-01-17T15:38:32.700 License: CC BY-SA 3.0" class="relativetime-clean">Jan 17 '14 at 15:38</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> <div id="answers"> <a name="tab-top"></a> <div id="answers-header"> <div class="answers-subheader grid ai-center mb8"> <div class="grid--cell fl1"> <h2 class="mb0" data-answercount="9">2 Answers<span style="display:none;" itemprop="answerCount">2</span></h2> </div> </div> </div> <a name="21567570"></a> <div id="answer-21567570" class="answer accepted-answer" data-answerid="21567570" data-ownerid="834692" data-score="4" itemprop="acceptedAnswer" itemscope="" itemtype="https://schema.org/Answer"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="21567570"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="4">4</div> <div class="js-accepted-answer-indicator grid--cell fc-green-500 py6 mtn8"><div class="ta-center"><svg aria-hidden="true" class="svg-icon iconCheckmarkLg" width="36" height="36" viewBox="0 0 36 36"><path d="m6 14 8 8L30 6v8L14 30l-8-8v-8z"></path></svg></div></div> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p>I'm adding this answer since the one above did not exactly solve it for me:</p> <p>Make sure that the echo statement uses encoding="none" -- <em>and</em> be sure to set it before the var rather than after. </p> <p>For some reason this works:</p> <p><code><!--#echo encoding="none" var="pageTitle" --></code></p> <p>but this does not:</p> <p><code><!--#echo var="pageTitle" encoding="none" --></code></p></div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature grid--cell"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="answered Feb 05 '14 at 02:32">answered Feb 05 '14 at 02:32</time> <a href="../../users/834692/bkurzius" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/834692.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="bkurzius" /> </a> <div class="s-user-card--info"> <a href="../../users/834692/bkurzius" class="s-user-card--link">bkurzius</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">4,020</li> <li class="s-award-bling s-award-bling__gold" title="2 gold badges">2</li> <li class="s-award-bling s-award-bling__silver" title="34 silver badges">34</li> <li class="s-award-bling s-award-bling__bronze" title="34 bronze badges">34</li> </ul> </div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-21567570" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="21567570" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-36191470" class="comment js-comment " data-comment-id="36191470" data-comment-owner-id="1961494" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment36191470_21567570"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">Yes, I noticed the encoding option must come first. Thanks for expliciting the constraint and your answer.</span> – <a href="../../users/1961494/ajlittoz" title="414 reputation" class="comment-user owner">ajlittoz</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment36191470_21567570"><span title="2014-05-10T13:37:49.407 License: CC BY-SA 3.0" class="relativetime-clean">May 10 '14 at 13:37</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> <a name="23562661"></a> <div id="answer-23562661" class="answer " data-answerid="23562661" data-ownerid="" data-score="0" itemprop="suggestedAnswer" itemscope="" itemtype="https://schema.org/Answer"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="23562661"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="0">0</div> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p><--#echo var="PageTitle" --> is missing the vertical bar/pipe.</p> <p>I haven't read the whole page, so not sure if this is the actual cause of your problem, but it needs to be rectified if you are using that. </p></div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature grid--cell"> <div class="user-info "> <div class="user-action-time">edited <span title="2014-05-09T10:51:16.403" class="relativetime">May 09 '14 at 10:51</span></div> <div class="user-gravatar32"></div> <div class="user-details" itemprop="author" itemscope="" itemtype="http://schema.org/Person"> <span class="d-none" itemprop="name"></span> <div class="-flair"></div> </div> </div> </div> <div class="post-signature grid--cell"> <div class="s-user-card s-user-card__deleted"> <time class="s-user-card--time" datetime="answered May 09 '14 at 10:45">answered May 09 '14 at 10:45</time> <div class="s-avatar s-avatar__32 s-user-card--avatar"> </div> <div class="s-user-card--info"></div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-23562661" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="23562661" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-36191426" class="comment js-comment " data-comment-id="36191426" data-comment-owner-id="1961494" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment36191426_23562661"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">You're right, exclamation point is missing in every code snippet. I'm sorry for this typo. This is not the cause of the problem: I didn't paste the code but retyped it all, forgetting the exclam. I'll edit the question.</span> – <a href="../../users/1961494/ajlittoz" title="414 reputation" class="comment-user owner">ajlittoz</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/21140548/html-page-title-not-interpreted-as-utf-8-when-using-ssi#comment36191426_23562661"><span title="2014-05-10T13:35:18.763 License: CC BY-SA 3.0" class="relativetime-clean">May 10 '14 at 13:35</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> </div> </div> </div> </div> <script src="../../static/js/stack-icons.js"></script> <script src="../../static/js/fromnow.js"></script> </body> </html>