0

我試圖構建一個Chrome擴展,獲取當前域打開的年齡,在此年齡生成一個不透明度值,並將此不透明度值應用於要置於頂部的疊加層的當前頁面。在Chrome擴展中使用ajax查詢

這是我不工作的做法:

的manifest.json

{ 
    "name": "overlay", 
    "version": "0", 
    "description": "art project", 
    "background": {"page": "background.html"}, 
    "manifest_version": 2, 
    "browser_action": { 
    "name": "art project", 
    "icons": ["icon.png"], 
    "default_icon": "icon.png" 
}, 
    "content_scripts": [ { 
    "js": [ "jquery-2.1.4.min.js", "background.js"], 
    "css": ["customStyles.css"], 
    "matches": [ "http://*/*", "https://*/*"] 
}] 
} 

background.js

var domain = location.hostname; 

$.ajax({ 
    url: 'http://whois.webhosting.info/' + domain, 
    type: 'GET', 
    success: function(res) { 

    // find table with class "body_text" 
    $(res.responseText).find('table.body_text').appendTo('body'); 
    var creation_date = $(res.responseText).find('table.body_text > tbody > tr:nth-child(5) > td:nth-child(2)').html(); 

    var str = creation_date.split(/(\s+)/); 

    // calculate the month number from month in string format 
    var monthcalc = ("JanFebMarAprMayJunJulAugSepOctNovDec".indexOf(str[0])/3 + 1); 

    // join the date 
    var domainage = str[2] + " " + monthcalc + " " + str[1]; 

    // create the date 
    var firstdate = new Date(domainage); 

    var today = new Date();   
    var dayDiff = Math.ceil(today.getTime() - firstdate.getTime())/(1000 * 60 * 60 * 24 * 365); 
    var age = parseInt(dayDiff); 
    $('#age').html(age+' years old'); 

    // calculate opacity of patina 
    patinaOpacity = (dayDiff * 1.5)/100; 
    console.log(patinaOpacity); 

    $("body").prepend('<div class="overlay">PATINA OVERLAY</div>'); 

    $(".patina-overlay").css({ 
    "z-index": "10000000000000", 
    "background": "black", 
    "opacity": patinaOpacity, 
    "position": "fixed", 
    "width": "100%", 
    "height": "100%", 
    "pointer-events": "none", 
    }); 

    } 
}); 

奇怪的是,此代碼工作完全正常的HTML文檔中 - 但不是當我將它實現爲Chrome擴展時。 Chrome擴展開發工具總是向我展示,我在這一行有一個語法錯誤var str = creation_date.split(/(\s+)/;,我不知道它有什麼問題。

+0

你確定它是一個_syntax_錯誤,或者它是一個運行時錯誤,沿着_cannot讀取屬性'split'undefined_?的行嗎? – Xan

+0

@Xan是啊,之前我也有錯誤'未捕獲TypeError:無法讀取屬性'分裂'undefined' ... – Retador

+0

你沒有看到關於CORRS之前的消息嗎? – Braiam

回答

1

雖然很難確切地說明代碼失敗的原因,但必須說的是,查詢Web WHOIS服務永遠不會結束。

此類服務幾乎總是對重複查詢提供保護:您可能正在觸摸CAPTCHA或類似的防禦措施。沒有無限制的免費WHOIS服務/ API是有原因的。

然後你的代碼將無法找到所需的元素,因爲你不檢查 - 在某處進一步分解。即使把它放在一邊,交叉源AJAX需要你在清單中的權限字段中聲明你正在查詢的地址。雖然我想在這種情況下,它不會調用success函數。


另一種可能性是非常可疑操作$(res.responseText),試圖解析HTML。您正在將外部代碼(可能包含腳本)注入當前文檔的上下文中。對於你無法控制的數據來說這不是一個好主意。