JS实现PC端URL跳转到对应移动端URL

摘要:在做移动端网站时,有时因技术问题或其他原因无法制作响应式版面,而移动端页面只能放到子目录下,但是手机端通过搜索引擎进入网站电脑端子页面,无法匹配到移动端页面,使得用户体验很不好

在做移动端网站时,有时因技术问题或其他原因无法制作响应式版面,而移动端页面只能放到子目录下,但是手机端通过搜索引擎进入网站电脑端子页面,无法匹配到移动端页面,使得用户体验很不好,即影响排名也影响转化。这里有一个js代码可以实现用户使用手机访问电脑端,自动跳转到对应手机页面。

举例:一个pc页面https://www.800xiaos.com/2/2795/,对应移动url为https://m.800xiaos.com/2/2795/,使用手机端访问pc页面https://www.800xiaos.com/2/2795/,则自动跳转至移动页面https://m.800xiaos.com/2/2795/。js代码如下:

<script type="text/javascript">      
function GetUrlRelativePath()
  {
    var url = document.location.toString();
    var arrUrl = url.split("//");
    var start = arrUrl[1].indexOf("/");
    var relUrl = arrUrl[1].substring(start);
    if(relUrl.indexOf("?") != -1){
      relUrl = relUrl.split("?")[0];
    }
    return relUrl;
  }
    var userAgentInfo = navigator.userAgent;
    var Agents = ["Android", "iPhone","SymbianOS", "Windows Phone","iPad", "iPod"];
    var flag = true;
    for (var v = 0; v < Agents.length; v++) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
            flag = false;
            break;
        }
    }
    if (!flag){
        location.href="https://m.800xiaos.com"+GetUrlRelativePath();;
    }
</script>

注意:这个办法并非最优选择,弊端在于对搜索引擎并不友好,因为加载资源后再跳转,增加了用户访问成本。建议使用301重定向来处理


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://shenqiku.cn/article/FLY_9145