使用XMLHttpRequest從WebExtension訪問休息服務時出錯

我想通過firefox WebExtension訪問我在亞馬遜AWS服務器上託管的休息服務。使用XMLHttpRequest從WebExtension訪問休息服務時出錯

我已經在manifest.json中註冊了後臺腳本，然後嘗試訪問該服務。

"background": { 
    "scripts": ["OwnerLangBackground.js"] 
}, 
"permissions": [ 
    "*://ec2-35-158-91-62.eu-central-1.compute.amazonaws.com:9000/*" 
]

但是，XMLHttpRequest的方法會返回一個錯誤，但我看不出有什麼不順心。 https://mathiasbynens.be/notes/xhr-responsetype-json

從上面的鏈接我現在有代碼的（略微修飾的）副本替換自己的代碼：儘管研究這個問題時，我看到以下頁面跌跌撞撞

// OwnerLangBackground.js 
console.log("OwnerLangBackground.js loaded"); 
var getJSON = function(url, successHandler, errorHandler) { 
    var xhr = new XMLHttpRequest(); 
    xhr.open('get', url, true); 
    xhr.onreadystatechange = function() { 
     var status; 
     var data; 
     // https://xhr.spec.whatwg.org/#dom-xmlhttprequest-readystate 
     if (xhr.readyState == 4) { // `DONE` 
      status = xhr.status; 
      if (status == 200) { 
       data = JSON.parse(xhr.responseText); 
       successHandler && successHandler(data); 
      } else { 
       errorHandler && errorHandler(status, xhr.responseText); 
      } 
     } 
    }; 
    xhr.send(); 
}; 

/* BLOCK 1: removing the comments for this block works 
getJSON('https://mathiasbynens.be/demo/ip', function(data) { 
    console.log('Your public IP address is: ' + data.ip); 
    console.log('Your response is: ', data); 
}, function(status) { 
    console.warn('Something went wrong.', status); 
}); 
*/ 

/* BLOCK 2: removing the comments for this block, does not work 
getJSON('http://ec2-35-158-91-62.eu-central-1.compute.amazonaws.com:9000/get-languages', function(data) { 
    console.log('Your response is: ', data); 
}, function(status) { 
    console.warn('Something went wrong.', status); 
}); 
*/

奇怪的是，激活BLOCK 1按預期工作（有意掩飾IP地址）。

OwnerLangBackground.js loaded 
    Your public IP address is: xxxx:xxxx:xxxx:xxxx:xxxx:xxxx:xxxx:xx 
    Your response is: Object { ip: "xxxx:xxxx:xxxx:xxxx:xxxx:xxxx:xxxx:…" }

激活塊2導致錯誤響應。

OwnerLangBackground.js loaded 
    Something went wrong. 0

但是，如果我直接調用使用curl的這兩個網址，它們都返回有效的JSON：

> curl https://mathiasbynens.be/demo/ip 
    {"ip":"xxxx:xxxx:xxxx::xxx"} 

    > curl http://ec2-35-158-91-62.eu-central-1.compute.amazonaws.com:9000/get-languages 
    [{"language":"??"},{"language":"de"},{"language":"en"},{"language":"fr"},{"language":"it"}]

我已經加入調試輸出到AWS服務器上我休息服務，我看到它被調用。我還在運行WebExtension的本地機器上使用Wireshark將WebExtension調用追蹤到其餘服務，並且我可以看到返回的JSON字符串，所以我猜測錯誤發生在firefox/webextension內的某處，但是我總損失。

事情我已經考慮：

權限在清單：據我可以告訴URL模式爲我的AWS-URL正確添加。但是，即使我沒有將url添加到權限
，但調用mathiasbynens.be的作品使用https，而不起作用的調用使用http。這可能是原因嗎？

任何人都可以指出我正確的方向，以獲得更多關於錯誤的反饋嗎？我試着給xhr請求添加一個onerror回調。它被稱爲，但據我所知，不提供更多的信息。

更新：我想出了兩個更多的想法。使用curl -v爲我提供了標題：

> curl -v http://ec2-35-158-91-62.eu-central-1.compute.amazonaws.com:9000/get-languages 
* Hostname was NOT found in DNS cache 
* Trying 35.158.91.62... 
* Connected to ec2-35-158-91-62.eu-central-1.compute.amazonaws.com (35.158.91.62) port 9000 (#0) 
> GET /get-languages HTTP/1.1 
> User-Agent: curl/7.38.0 
> Host: ec2-35-158-91-62.eu-central-1.compute.amazonaws.com:9000 
> Accept: */* 
> 
< HTTP/1.1 200 
< Content-Type: application/json;charset=UTF-8 
< Transfer-Encoding: chunked 
< Date: Sun, 23 Apr 2017 06:43:42 GMT 
< 
* Connection #0 to host ec2-35-158-91-62.eu-central-1.compute.amazonaws.com left intact 
[{"language":"??"},{"language":"de"},{"language":"en"},{"language":"fr"},{"language":"it"}] 


> curl -v https://mathiasbynens.be/demo/ip 
* Hostname was NOT found in DNS cache 
* Trying 2a01:1b0:7999:402::144... 
* Connected to mathiasbynens.be (2a01:1b0:7999:402::144) port 443 (#0) 
* successfully set certificate verify locations: 
* CAfile: none 
    CApath: /etc/ssl/certs 
* SSLv3, TLS handshake, Client hello (1): 
* SSLv3, TLS handshake, Server hello (2): 
* SSLv3, TLS handshake, CERT (11): 
* SSLv3, TLS handshake, Server key exchange (12): 
* SSLv3, TLS handshake, Server finished (14): 
* SSLv3, TLS handshake, Client key exchange (16): 
* SSLv3, TLS change cipher, Client hello (1): 
* SSLv3, TLS handshake, Finished (20): 
* SSLv3, TLS change cipher, Client hello (1): 
* SSLv3, TLS handshake, Finished (20): 
* SSL connection using TLSv1.2/ECDHE-RSA-AES128-GCM-SHA256 
* Server certificate: 
*  subject: OU=Domain Control Validated; OU=PositiveSSL Wildcard; CN=*.mathiasbynens.be 
*  start date: 2015-07-28 00:00:00 GMT 
*  expire date: 2018-08-12 23:59:59 GMT 
*  subjectAltName: mathiasbynens.be matched 
*  issuer: C=GB; ST=Greater Manchester; L=Salford; O=COMODO CA Limited; CN=COMODO RSA Domain Validation Secure Server CA 
*  SSL certificate verify ok. 
> GET /demo/ip HTTP/1.1 
> User-Agent: curl/7.38.0 
> Host: mathiasbynens.be 
> Accept: */* 
> 
< HTTP/1.1 200 OK 
< Date: Sun, 23 Apr 2017 06:44:16 GMT 
* Server Apache is not blacklisted 
< Server: Apache 
< Access-Control-Allow-Origin: * 
< Strict-Transport-Security: max-age=15768000; includeSubDomains 
< Vary: Accept-Encoding 
< Cache-Control: max-age=0 
< Expires: Sun, 23 Apr 2017 06:44:16 GMT 
< X-UA-Compatible: IE=edge 
< X-Content-Type-Options: nosniff 
< X-Frame-Options: DENY 
< X-XSS-Protection: 1; mode=block 
< Transfer-Encoding: chunked 
< Content-Type: application/json;charset=UTF-8 
< 
* Connection #0 to host mathiasbynens.be left intact 
{"ip":"xxxx:xxxx:xxxx::xxx"}

的一個區別是伸出的是，我的休息服務的迴應缺乏Transfer-Encoding和Access-Control-Allow-Origin?頭，所以我會考慮添加這些。

不過，如果任何人有一個關於如何獲得更多的錯誤信息的XmlHttpRequest錯誤的提示，我會很高興聽到它。

來源

2017-04-22 Urs Beeli

好吧，它似乎缺少Access-Control-Allow-Origin?標題是我的問題的根源。

我現在通過添加另一個方法參數HttpServletResponse response然後在該參數上調用setHeader()來更改我的Spring-RestControllers中的所有方法。

@RequestMapping("/get-languages") 
public @ResponseBody List<Language> getLanguages(HttpServletResponse response) { 
    response.setHeader("Content-Type", "application/json;charset=UTF-8"); 
    response.setHeader("Access-Control-Allow-Origin", "*"); 
    return languageRepository.findAll(); 
}

現在我的WebExtension可以使用XmlHttpRequest成功地使用此休息服務。

如果這些信息（CORS頭文件丟失）在firefox的調試或js控制檯中的某處可見，那麼這將會很有幫助，所以如果任何人都可以告訴我我是怎麼看到這個的，我仍然會很欣賞暗示。

來源

2017-04-23 07:56:03

使用XMLHttpRequest從WebExtension訪問休息服務時出錯

回答

相關問題