0

我是 API 使用的新手。我已经通过 javascript 代码正确地使用了 Google Page Insights V.5 API,但我终生无法成功地为 GTMetrix 这样做。似乎与 GTMetrix API 和 Javascript 相关的唯一信息是 RapidApi 网站的链接。我只是希望从 GTMetrix 中实现与从 Google 中相同的简单数据检索。这可能吗?

当我将请求设置为:

https://gtmetrix.com/api/0.1/?login-user=myemail@email.com&login-pass=MyRanDomApIKeY&location=2&url=https://sitetotest.com

因为当我将我的 Google Page Insights Request URL 设置为以下内容时,它可以工作。

https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://websitetotest.com&category=performance&strategy=desktop&key=MyRanDomApIKeY

以下代码适用于 Google Page Insights,我什至可以在浏览器窗口中使用以下 URL 检索 JSON 数据:

<div id="firstmetric"></div>
<br>
<div id="domSize"></div>

<button>Click Me</button>

<script>
$('button').click(function(){

var baseUrl = "https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=";


var fieldUrl = "https://websitetotest.com";
var trailing = "&category=performance&strategy=desktop&key=MyRanDomApIKeY";

$.getJSON(baseUrl + fieldUrl + trailing, function(data){

console.log(data);

var item = data.lighthouseResult.categories.performance.auditRefs[0].weight;
var domSize = data.lighthouseResult.audits['dom-size'].displayValue;



$("#firstmetric").html( item );

$("#domSize").html( domSize );

});

});

我真的需要为我详细说明它,因为任何更少的东西都会导致我提出后续问题并使我们陷入困境。:/

作为一个新手,JSFiddle 一直是我学习过程中测试、尝试、打破和构建的救命资源。如果要求不高的话,小提琴会帮助我让我的大脑处理事情。

4

1 回答 1

1

您正在使用的参数:login-userlogin-pass参考您正在分析的页面上的 HTTP 身份验证(如 GTmetrix 将在您的分析中传递这些参数)而不是您的 GTmetrix API 凭据。

正如API docs所指出的,用于 GTmetrix API 的身份验证是您的用户名电子邮件和您的 API 密钥作为密码。

要记住的另一件事是 GTmetrix 不允许您通过 Web 应用程序前端进行 API 调用,因为它们不允许CORS 请求。如果您通过普通网站上的 Web 应用程序执行此操作,您将暴露您的 GTmetrix API 密钥,这可能不是一个好主意。

因此,您将通过您的后端代码来执行此操作。例如,如果通过 Node JavaScript 完成:

fetch("https://gtmetrix.com/api/0.1/locations", {
    headers: new Headers({
        "Authorization": 'Basic ' + btoa("[YOUR E-MAIL]" + ":" +"[YOUR API KEY]"),
    }),
}).then(res => res.json())
.then(response => console.log(response));

会打印我的位置数组。

请注意,无论您选择哪种后端代码,您都需要为 API 调用添加基本授权标头请求并对其进行正确编码(这就是 btoa 函数调用所做的事情)。

于 2019-05-28T20:00:17.767 回答