5

We've been using iframes on remote sites to embed CiviCRM contributions pages with generally good results. However, we've recently found out that it is failing in Internet Explorer and Safari. It seems that it has to do with browser policies on allowing cookies set via iframes. Anyone else experienced this? Any ideas on how to resolve it?

It's a bit of a struggle since neither browser will install on linux, however, one user reported getting:

We can't load the requested web page. This page requires cookies to be enabled in your browser settings. Please check this setting and enable cookies (if they are not enabled). Then try again. If this error persists, contact the site adminstrator for assistance.
4

After a lot of desperate digging we have come up with a work-around. I think the right answer is: Don't use iframes. There seems to be thoughtful reasons to restrict the flow of cookies/session information between an iframe and the parent and even though we have figured out a way to work-around it now, I'm not confident these tricks will work in the future.

Having said that...

For Internet Explorer, we got it to work by sending a header declaring our P3P policy. We used the following in settings.php (I'm sure you could put it in civicrm.settings.php too):

header('P3P:CP="IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT"');

That seemed to placate IE (note: you should really lookup what these codes mean before blindly putting this into place - each one of these codes has meaning - more information on meaning is available here).

Safari was much harder. We had to add the javascript provided on a helpful blog post to get things working. It's a crappy solution - since it essentially redirects the user to the CiviCRM page and then back to the iframed page - which is confusing for the user and delays the loading of the page.

Here's the code I added to the Drupal theme's template.php file:

function tceiframe_preprocess_html(&$variables) {
  // Call our parent to do most of the work.
  newsflash_preprocess_html($variables);
  $path = drupal_get_path('theme', 'tceiframe');
  drupal_add_js($path . '/safari.iframe.fix.js');
}

And here is the javascript:

window.onload=function(){
 if(navigator.userAgent.indexOf('Safari')!=-1&&navigator.userAgent.indexOf('Chrome')==-1){
  var cookies=document.cookie;

  if(top.location!=document.location){
   if(!cookies){
    href=document.location.href;
    href=(href.indexOf('?')==-1)?href+'?':href+'&';
    top.location.href =href+'reref='+encodeURIComponent(document.referrer);
   }
  } else {

   ts=new Date().getTime();document.cookie='ts='+ts;
   rerefidx=document.location.href.indexOf('reref=');
   if(rerefidx!=-1){
    href=decodeURIComponent(document.location.href.substr(rerefidx+6));
    window.location.replace(href);
   }
  }
 }
}
  • Jamie, is there a public repo where one could look at your code? I have just received a request to provide CiviCRM for membership and event management to an organization that uses a proprietary CMS. I might propose the old standby of mimicking the branding of the site and its header on a Drupal or WordPress install of CiviCRM, but that causes the maintenance headache of keeping that stuff in sync over the months and years. – Joe Murray Mar 2 '16 at 19:11
  • Hi Joe - for IE - I really did just insert exactly what I put in my answer into the settings.php file. – Jamie Mar 4 '16 at 14:55
  • The safari code is in the private repo of the organization that is using it. But I can share the snippet here. I put this in the function.php file of the custom theme that we specifically designed to be served as an iframe (all styling is removed - just a white back ground and no borders): – Jamie Mar 4 '16 at 14:56
  • stack exchange doesn't seem to want me to add this stuff as a comment so I will edit my answer instead. – Jamie Mar 4 '16 at 14:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.