Unsplash API JavaScript 示例

Unsplash API 允许开发人员使用高质量的图片来增强他们的应用程序。在此文档中，我们将介绍如何使用 JavaScript 调用 Unsplash API。

步骤1：注册开发者帐户

在开始之前，您需要在 Unsplash 上注册并创建一个新的开发者帐户。在此过程中，您将获得一组 API 密钥，您需要在调用 Unsplash API 时使用它。

步骤2：获取访问权限

在使用 Unsplash API 之前，您需要获得访问权限。为了获得访问权限，请转到您的 Unsplash 帐户并在 "API 访问" 部分下创建一个新的应用程序。在创建新应用程序时，您需要为其提供名称、描述和许多其他信息。一旦创建了应用程序，您将获得一组凭据，包括访问密钥和密钥密码。

步骤3：编写 JavaScript 代码

现在，我们可以编写 JavaScript 代码来调用 Unsplash API。请参阅以下示例代码：

const accessKey = 'YOUR_ACCESS_KEY';

fetch(`https://api.unsplash.com/photos/random?client_id=${accessKey}`)
  .then(response => response.json())
  .then(data => {
    document.body.style.backgroundImage = `url(${data.urls.full})`;
  })
  .catch(error => console.log(error));

该代码使用 fetch() 函数从 Unsplash API 加载一张随机的照片。我们使用上面获得的访问密钥作为查询参数，以便 Unsplash 可以识别我们的应用程序。

一旦我们接收到响应，我们便将其转换为 JSON 格式，并使用 data 对象中提供的信息更新页面的背景图片。

步骤4：测试您的代码

现在，您可以使用以上提供的代码并在浏览器中测试它。如果一切正常，您应该能够看到一张随机的 Unsplash 图片作为页面的背景。

总结

在本文中，我们了解了如何使用 JavaScript 调用 Unsplash API。该代码使用 fetch() 函数从 Unsplash API 加载一张随机的照片，并将其用作页面的背景图片。记得在调用 Unsplash API 时始终使用您的访问密钥，以便 Unsplash 可以识别您的应用程序。