pc端和移动端 采用同一个页面，缓存后，如何共存？

Question

宝塔后台，nginx+php+mysql
pc端域名 www.sf.com 和 手机端域名 m.sf.com 绑定在同一个目录下；
页面伪静态，为了实现双端访问效果，采用php函数 判断http_host是否是字母'm'开头，调用对应css并修改相应url的http_host。
函数如下：

function m_url($str){
    $http_host = htmlentities($_SERVER['HTTP_HOST'], ENT_QUOTES, 'UTF-8');
    $is_shouji = substr($http_host, 0, 1) === 'm';
    if($is_shouji == "m"){
        $m_url = preg_replace('/^(https?:)?(\/\/)(?!m)(.*)$/i', '$1$2m$3', $str);
    }else{
        $m_url = $str;
    }
    return $m_url;
}

http_host = m.sf.com 时插入m.css,用m_url替换所有A链接；
伪静态下，一切正常，开启缓存后就不行了。
---【缓存后，无法执行函数，链接全部显示成pc地址了】

请问，有什么好的方案？

Answer 1

不同的域名返回不同的index.html不就好了，你搞哪么麻烦干什么

Answer 2

不同域名返回同一个 index.html。

在 head 部分使用 js 判断域名，根据不同域名给 body 标签添加不同 class。

在 CSS 文件中根据 body 的 className 分别应用不同规则。

Answer 3

Nginx 配置一下：

http {
    ...
    proxy_cache_path /path/to/your/cache/pc levels=1:2 keys_zone=pc_cache:10m;
    proxy_cache_path /path/to/your/cache/mobile levels=1:2 keys_zone=mobile_cache:10m;
    ...
}

server {
    ...
    location / {
        ...
        if ($http_host ~* ^m\.sf\.com$) {
            proxy_cache mobile_cache;
        }
        if ($http_host ~* ^www\.sf\.com$) {
            proxy_cache pc_cache;
        }
        ...
    }
}

php:

// 修改你的缓存键生成函数
function generate_cache_key() {
    $http_host = htmlentities($_SERVER['HTTP_HOST'], ENT_QUOTES, 'UTF-8');
    return $http_host . '_' . $other_variables;
}