移動URL重定向和桌面URL重定向

我需要幫助嗎？我想讓我的網站擁有桌面版和移動版。將樣式編碼爲正確的HTML元素寬度很容易，但URL更難。我想知道的是，如何製作一個URL導致在桌面上的主頁，但在移動網頁上的URL是不同的，但它與桌面版本，但在移動版本中的相同的主頁。你知道是否有任何代碼可以做到這一點，沒有任何錯誤，私下預覽它。我不介意你的回答是否使用PHP或JavaScript等。移動URL重定向和桌面URL重定向

這是我嘗試使用的代碼。我不確定它是否有效。不能說可能做到了。

$(document).ready(function() { 
    $(window).on("load resize", function() { 
     if($(window).width() <= 950) { 
      var mobile = window.location = "/mindex.php"; 
      console.log("The location is " + mobile); 
     } else if($(window).width() > 950) { 
      var desktop = window.location = "/index.php"; 
      console.log("The location is " + desktop); 
     } else { 
      var defaultPlace = ""; 
      console.log("Defualt location: " + defaultPlace); 
     } 
    }); 
});

你能幫我嗎？請記住，我希望獲得關於製作移動重定向網址和桌面網址的一些幫助，但這兩者都會導致相同的頁面，但請使用不同的版本。

來源

2017-10-07 Harry Smart

爲什麼不用PHP來做到這一點？或使用CSS樣板Bootstrap？主要關注移動首次開發。 –

請參閱...而不是每個頁面加載屏幕大小，您可以先設置會話名稱，然後檢查會話並重定向它... – GYaN

而不是使用會話（這是最糟糕的想法）使用標題來獲取操作系統的用戶和其他詳細信息，如設備名稱，設備類型和手機重定向。 –

您可以使用用戶代理標題瀏覽器發送來檢查用戶是移動用戶還是桌面用戶，並根據返回的值重定向。

var usrAgent = navigator.userAgent;

現在你知道了用戶代理，檢查返回的用戶代理是移動或不併相應地重定向 - -

function detectMobile() 
{ 
    if(usrAgent.match(/Mobile/i)) 
    { 
     return "Mobile"; 
    } 
} 

var isMobile = detectMobile(); 

if(isMobile) 
{ 
    window.location = "MOBILE_URL"; 
} 
else 
{ 
    window.location = "DESKTOP_URL"; 
}

另外，

您可以使用此檢查user-agent標題

您可以使用此用html 鏈接標記來重定向到任何網頁根據用戶設備寬度

<link rel="alternate" media="only screen and (max-width: 640px*)" href="MOBILE_URL_TO_REDIRECT">

*根據您的要求更改此寬度。 640px是移動設備的理想最大寬度。

我希望這可以解決您的問題。

來源

2017-10-07 10:55:44

說實話，你的代碼工作，我看到但是我嘗試了它，它每隔1秒鐘不斷重新加載頁面，並沒有顯示任何東西。它的行爲就像是一個永不停息的無限循環。顯示控制檯日誌消息，但它意味着顯示它是否正在工作。所以你的代碼工作，但它加載頁面repertley像一個無限循環。那麼你有什麼想法來解決這個問題嗎？：D –

但順便說一下，這個問題，它有助於很多謝謝：D –

移動URL重定向和桌面URL重定向

回答

相關問題