README

通过Instagram Basic Display API抓取Instagram内容

需求

此插件需要Craft CMS 4.0.0或更高版本。

安装

要安装此插件，请按照以下说明操作。

打开您的终端并转到您的Craft项目
```
 cd /path/to/project
```
然后让Composer加载插件
```
 composer require jsmrtn/craftagram
```
在控制面板中，转到设置 → 插件，然后点击craftagram的“安装”按钮。

设置您的Facebook应用

⚠️ 注意：第6步中，您的有效的OAuth重定向URI 必须是基础站点的URL，不要尝试使用单个多站点URL。基础站点的URL将附加一个状态参数，以确保Instagram的响应针对正确的站点。

登录到https://developers.facebook.com，在所有应用中点击创建应用。
当被问及您希望应用做什么？时，点击其他。
选择消费者应用类型。
添加合适的应用名称和联系邮箱（您可以将添加业务组合略过）。
您将被重定向到您的新应用，从仪表板找到Instagram Basic Display产品，并点击设置将其添加到您的应用中。
重定向后，点击创建新应用，并为您的应用命名。
当呈现应用页面时，使用以下信息完成每个部分
- 有效的OAuth重定向URI 输入您的主站基础URL，附加/actions/craftagram/default/auth（例如，https://www.yourwebsite.com/actions/craftagram/default/auth）。
- 取消授权回调URL 和 数据删除请求回调URL 使用上述相同的URL。
- 保存更改
向下滚动到Instagram测试者部分。点击添加Instagram测试者。
点击添加人员，选择Instagram测试者，然后搜索您要连接的instagram账户，然后点击添加。
在新的网页浏览器中打开www.instagram.com并登录您刚刚邀请的Instagram账户。点击更多 > 设置 > 网站权限 > 应用和网站 > 测试者邀请并接受邀请。

这就完成了！现在您不需要任何额外的设置。您需要做的是转到产品 > Instagram > 基本显示，然后向下滚动到Instagram应用ID和Instagram应用密钥，因为您需要在下一步中添加这些。

配置craftagram

转到craftagram的设置页面，并将上一步中的App ID和App Secret输入到所需的框中，然后点击'保存'。当页面刷新时，您会看到一个新按钮授权Craft。点击此按钮，转到instagram完成授权程序。

提示：App ID和App Secret设置可以设置为环境变量。有关更多信息，请参阅Craft文档中的环境配置。

Instagram可能会要求您登录，然后处理该登录，然后点击'授权'。您将被重定向回Craft，其中长访问令牌字段已填充。

⚠️ 在尝试进行身份验证之前，请检查您是否已登录到正确的账户（或者根本不要登录）。如果您在当前浏览器会话中使用不同的用户登录，您可能会遇到问题。

保持您的令牌激活

Instagram令牌在60天后过期，因此您需要设置一个cron任务来保持令牌有效。刷新操作为actions/craftagram/default/refresh-token。

例如，这将在每个月运行一次令牌刷新，适用于所有启用了令牌的网站

0 0 1 * * /usr/bin/wget -q https://www.yourwebsite.com/actions/craftagram/default/refresh-token >/dev/null 2>&1

如果您只想更新单个网站，您可以添加可选参数siteId

0 0 1 * * /usr/bin/wget -q https://www.yourwebsite.com/actions/craftagram/default/refresh-token?siteId=<your siteId> >/dev/null 2>&1

如果您未能设置cron，您仍然可以通过访问设置页面、点击授权Craft并遵循上述步骤手动刷新令牌。

⚠️ 您不能刷新私人Instagram账户的访问令牌，因此请确保上面测试邀请中使用的账户是公开的

使用craftagram

使用插件非常简单

{% set craftagram = craft.craftagram.getInstagramFeed() %}

{% if craftagram|length %}
    {% for item in craftagram.data %}
        <img src={{item.media_url}} />
    {% endfor %}
{% endif %}

变量有两个可用参数，分别是limit和siteId。Instagram的默认限制为25。

{% set craftagram = craft.craftagram.getInstagramFeed(25, currentSite.id) %}

您将获得所有API端点提供的选项，为了简洁起见，它们是

分页

如果您对您的动态有限制，您可以通过传递after（如果您正在向后分页，则为before）参数，并初始化一个AJAX函数来返回数据。

请记住传递limit，并且如果适用，还需要传递正确的主站siteId。

例如，您可以通过这种方式实现“加载更多”按钮

{% set craftagram = craft.craftagram.getInstagramFeed(10) %}

{% if craftagram|length %}
    <div data-js="insta-wrapper">
        {% for item in craftagram.data %}
            <img src={{item.media_url}} />
        {% endfor %}
    </div>

    <a data-after="{{ craftagram.paging.cursors.after }}" data-js="load-more">Load more</a>
{% endif %}

{% js %}
    $("[data-js=load-more]").click(function(e) {
        e.preventDefault();
        $.get("{{ parseEnv(craft.app.sites.primarySite.baseUrl) }}/actions/craftagram/default/get-next-page?siteId={{ currentSite.id }}&limit=10&url=" + $(this).data('after'), function(res) {
            data = $.parseJSON(res);

            // For each, append the item to our wrapper
            $.each(data["data"], function() {
                $("[data-js='insta-wrapper']").append("<img src="+$(this)[0]["media_url"]+" />");
            });

            // Update the paging with the next after.
            $("[data-js=load-more]").data("after", data["paging"]["cursors"]["after"]);
        });
    });
{% endjs %}

无头模式

如果您使用Craft无头（或通常只需要JSON格式的结果），您可以通过/actions/craftagram/default/api（如果您想节省一些字节，则为/craftagramApi）访问Instagram动态，这将返回Instagram的原始JSON数据。您可以传递以下参数

安全

有一个设置可以启用更安全的API端点。如果您开启它，您必须传递一个Basic Auth头才能访问此端点，否则您将收到错误。用户名和密码应为已激活的Craft用户。**请注意**，您必须为每个网站单独启用安全端点。

速率限制

请注意，您可能受到Instagram的速率限制，因此如果您在一个高流量网站上，您可能会被速率限制。您可以在Instagram的文档中了解更多关于速率限制的信息。

媒体大小

API返回的图像是固定大小的，以前您可以使用类似large的修饰符来获取特定大小的图像，但不再如此。您需要使用支持从远程URL转换图像的插件来调整Instagram返回的图像大小。

jsmrtn / craftagram

维护者

详细信息