在 Sveltekit 应用程序中从 Mailchimp 获取数据时遇到问题

Question

我在网上几乎找不到关于这个特定问题的信息。

我实际上是在尝试将我的 sveltekit 应用程序连接到 Mailchimp 中的活动列表。

我必须从 Google App 脚本文件中获取一些代码，并将其修改为简洁的。数据是通过谷歌应用脚本很好地提取的，我刚刚测试过。

我的 .env 文件中的 API 密钥是正确的，但我似乎无法弄清楚为什么没有获取数据。

<script context="module">
  export async function load() {
    const apiKey = process.env.MAILCHIMP_API_KEY;
    const serverPrefix = apiKey.split('-')[1];
    const REPORT_START_DATE = '2022-01-01 00:00:00'; // Adjust as needed

    const campaignListUrl = `https://${serverPrefix}.api.mailchimp.com/3.0/campaigns?count=500&since_send_time=${REPORT_START_DATE}`;

    try {
      const response = await fetch(campaignListUrl, {
        method: 'GET',
        headers: {
          'Authorization': `apikey ${apiKey}`,
          'Content-Type': 'application/json',
        },
      });

      if (!response.ok) {
        throw new Error(`Error fetching Mailchimp campaigns: ${response.statusText}`);
      }

      const responseData = await response.json();
      console.log('Campaigns Response:', responseData);

      const campaigns = await Promise.all(
        responseData.campaigns.map(async (campaign) => {
          const reportsUrl = `https://${serverPrefix}.api.mailchimp.com/3.0/reports/${campaign.id}`;
          const reportsResponse = await fetch(reportsUrl, {
            method: 'GET',
            headers: {
              'Authorization': `apikey ${apiKey}`,
              'Content-Type': 'application/json',
            },
          });

          if (!reportsResponse.ok) {
            throw new Error(`Error fetching report for campaign ${campaign.id}: ${reportsResponse.statusText}`);
          }

          const reportsData = await reportsResponse.json();

          const unsubscribeRate = reportsData.unsubscribed / reportsData.emails_sent || 0;
          const hardBounces = reportsData.bounces.hard_bounces;
          const softBounces = reportsData.bounces.soft_bounces;
          const totalBounces = hardBounces + softBounces;

          return {
            id: campaign.id,
            title: campaign.settings.title,
            subject: campaign.settings.subject_line,
            send_time: campaign.send_time,
            emails_sent: reportsData.emails_sent,
            abuse_reports: reportsData.abuse_reports,
            unsubscribed: reportsData.unsubscribed,
            unsubscribe_rate: unsubscribeRate,
            hard_bounces: hardBounces,
            soft_bounces: softBounces,
            bounces: totalBounces,
            syntax_errors: reportsData.bounces.syntax_errors,
            forwards_count: reportsData.forwards.forwards_count,
            forwards_opens: reportsData.forwards.forwards_opens,
            opens_total: reportsData.opens.opens_total,
            unique_opens: reportsData.opens.unique_opens,
            open_rate: reportsData.opens.open_rate,
            last_open: reportsData.opens.last_open,
            clicks_total: reportsData.clicks.clicks_total,
            unique_clicks: reportsData.clicks.unique_clicks,
            unique_subscriber_clicks: reportsData.clicks.unique_subscriber_clicks,
            click_rate: reportsData.clicks.click_rate,
          };
        })
      );

      return { props: { campaigns } };
    } catch (error) {
      console.error('Error fetching Mailchimp data:', error);
      return { props: { campaigns: [] } }; 
    }
  }
</script>

<script>
  export let campaigns = []; 
</script>

<h1>Mailchimp Campaigns</h1>
{#if campaigns.length > 0} 
  <ul>
    {#each campaigns as campaign}
      <li>
        <h2>{campaign.title}</h2>
        <p>Subject: {campaign.subject}</p>
        <p>Send Time: {campaign.send_time}</p>
        <p>Emails Sent: {campaign.emails_sent}</p>
        <p>Abuse Reports: {campaign.abuse_reports}</p>
        <p>Unsubscribed: {campaign.unsubscribed}</p>
        <p>Unsubscribe Rate: {(campaign.unsubscribe_rate * 100).toFixed(2)}%</p>
        <p>Hard Bounces: {campaign.hard_bounces}</p>
        <p>Soft Bounces: {campaign.soft_bounces}</p>
        <p>Total Bounces: {campaign.bounces}</p>
        <p>Syntax Errors: {campaign.syntax_errors}</p>
        <p>Forwards Count: {campaign.forwards_count}</p>
        <p>Forwards Opens: {campaign.forwards_opens}</p>
        <p>Opens Total: {campaign.opens_total}</p>
        <p>Unique Opens: {campaign.unique_opens}</p>
        <p>Open Rate: {campaign.open_rate}</p>
        <p>Last Open: {campaign.last_open}</p>
        <p>Clicks Total: {campaign.clicks_total}</p>
        <p>Unique Clicks: {campaign.unique_clicks}</p>
        <p>Unique Subscriber Clicks: {campaign.unique_subscriber_clicks}</p>
        <p>Click Rate: {campaign.click_rate}</p>
      </li>
    {/each}
  </ul>
{:else}
  <p>No campaigns found.</p> 
{/if}

Answer 1

这不是当前版本的 SvelteKit 中负载的工作方式，请参阅文档：https://kit.svelte.dev/docs/load

该函数应在页面或布局的单独 JS/TS 文件中定义。