【Google Search SEO】Javascript 參數化網址 | 網頁已建立索引，但沒有內容
這次嘗試在Blogger內用javascript, 來做個快速查詢振興五倍券加碼券的小工具
https://wiyafunworld.blogspot.com/2021/10/5000-coupon-check.html
寫javascript倒不是甚麼問題, 查詢介面與javascript暴力比對邏輯也很快就寫出來了.
結果發現Google Search Console已經索引了, 但出現了【網頁已建立索引，但沒有內容】的安全性警告。
想當然爾, Google Search果然甚麼都搜尋不出來。
在Google Search Console的審查結果頁面，Google給了些提示【詳細資料】
|
網頁已建立索引，但沒有內容：這個網頁會出現在 Google 索引中，但基於某些原因，Google 無法讀取網頁內容。可能的原因包括網頁採用偽裝手法對 Google 隱藏了內容，或是使用了 Google 無法建立索引的格式。這「不屬於」受到 robots.txt 封鎖的情況。請參閱這個網頁，並查看涵蓋範圍一節的詳細說明。
|
很好，網頁內容是說，因為我的寫法，可能出現網頁結果內容與html內容不一致，他認為有偽裝的內容在內，他會不幫你索引？
上網Google了一下分享的經驗，加上這個網頁超級簡單，就只有廣告 + div字串 + Javascript的程式碼而以，前兩者根據經驗應該不會有問題，問題一定在javascript所引發出來的。
朝著下面幾種可能去猜
- 可能性１：Javascript 動態UI寫法造成Google判定偽裝網頁不給索引【偽裝手法】
- 可能性２：Javascript參數化網址，重複網址造成無法判定標準網址，因而降低檢索頻率【整合重複的網址】
- 可能性３：Javascript參數化網址，造成無法有效率的檢索網頁內容【禁止檢索參數化重複內容】
先說說我的程式碼，我javascript使用了標準的網頁參數的取得方式，來做到把搜尋設定用參數方式帶回來，讓網友可以用於分享網址看查詢結果。
var getUrlString = location.href;
var url = new URL(getUrlString);
if (url.searchParams.get('weekly')!=null){
weekCheck.checked = url.searchParams.get('weekly')=="true"?true:false;
}
if (url.searchParams.get('part')!=null){
partCheck.checked = url.searchParams.get('part')=="true"?true:false;
}
if (url.searchParams.get('id')!=null){
idField.value = url.searchParams.get('id');
checkResult();
}
針對可能性１：我嘗試將分享功能拔掉，或是將form submit改成純button input(避免重新導向安全性問題），都沒有解決這個安全性問題。
我後來在Google開發者網站中翻到這篇
大意是說Google現在針對你們這種Javascript動態網頁，已經會試著parser囉，加上我的寫法看起來也不像偽裝原則中的幾個可能性。
針對可能性２：
那Javascript 參數化網址最有可能造成這個警告訊息了
根據【整合重複的網址】說明，你的網址是以下這幾種類型，網址有多種可能性，最嚴重可能會導致parser出問題。
|
如果您未將標準網址明確告知 Google，Google 會自行選擇標準網址，或是認定標準及重複網址的參考權重相同，這可能會導致某些非預期的行為
|
為了支援多種裝置類型：
|
https://example.com/news/koala-rampage
https://m.example.com/news/koala-rampage
https://amp.example.com/news/koala-rampage
|
為了支援搜尋參數或工作階段 ID 等元素而採用動態網址：
|
https://www.example.com/products?category=dresses&color=green
https://example.com/dresses/cocktail?gclid=ABCD
https://www.example.com/dresses/green/greendress.html
|
同一篇文章置於網誌的不同版面底下時，系統會自動儲存多個網址：
|
https://blog.example.com/dresses/green-dresses-are-awesome/
https://blog.example.com/green-things/green-dresses-are-awesome/
|
伺服器經過設定，會針對 www/非 www、http/https 版本的網址提供相同的內容：
|
http://example.com/green-dresses
https://example.com/green-dresses
http://www.example.com/green-dresses
|
於是我嘗試透過網頁中推薦的方式，加上了rel=canonical 來嘗試宣告標準網址。
<link href="https://wiyafunworld.blogspot.com/2021/10/5000-coupon-check.html" rel="canonical">
過了一天等Google Search Console檢索，錯誤依然在。
針對可能性３：
於是開始考慮【禁止檢索參數化重複內容】內的說法要怎麼解
|
如果您的網站會使用網址參數來顯示無關緊要的網頁變化版本 (例如 color=red 和 color=green)，或是使用參數在不同網址 (例如 example.com/shirts?style=polo,long-sleeve 和 example.com/shirts?style=polo&style=long-sleeve) 顯示大致相同的內容，就可能導致 Google 無法有效率地檢索您的網站。
|
也就是說，如果參數網址的可能性很多，就可能造成要parser你的網址，可能性太多而造成檢所不完，然後出現安全性警告說的有索引但無內容。
網站中說的解法：
使用Google 【網址參數工具】來宣告參數對於該網頁是否需要被檢索。
但這工具要使用有兩個條件
您的網站必須符合下列所有條件，才能使用網址參數工具。很可惜，前者我不符合。
- 您的網站有超過 1,000 個網頁。
- 您的記錄顯示 Googlebot 已為大量重複網頁建立索引，而且這些重複網頁的差異只在於網址參數 (例如：example.com?product=green_dress 和 example.com?type=dress&color=green)。
實際上我也去設定了，但是無效。
網路上的解法：
於是我嘗試用關鍵字「URL parameter SEO」發現了新天地，或許可以嘗試繞過Google 判斷我是參數化網頁，讓Google只檢索標準無參數網址就好。
於是將網址參數的取法，改為自己parser，參考code如下
if (GetQueryStringParams('weekly')!=null){
weekCheck.checked = GetQueryStringParams('weekly')=="true"?true:false;
}
if (GetQueryStringParams('part')!=null){
partCheck.checked = GetQueryStringParams('part')=="true"?true:false;
}
if (GetQueryStringParams('id')!=null){
idField.value = GetQueryStringParams('id');
checkResult();
}
// get the values from the query string.SEO friendly.(url.searchParams not SEO friendly)
function GetQueryStringParams(sParam) {
var sPageParameter = window.location.href.split('?');
if(sPageParameter[1]==null || sPageParameter[1]=='undefined' ){
return null;
}
var sURLVariables = sPageParameter[1].split('&');
for (var i = 0; i < sURLVariables.length; i++) {
var sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] == sParam) {
return sParameterName[1];
}
}
return null;
}
終於!!! 這樣寫，隔了整整一天，檢索後，終於網頁檢索成功了~~~~
上班在debug，下班也有滿滿的Bug要解XD
