Next.js でbuildすると読み込めていたAPIの値が読み込めない

Question

Next.js でTVMazeというサービスのAPIを使ってアプリケーションを作成中、buildをするとnpm run dev では発生しないエラーが発生。
＜エラー内容＞
Cannot read property time of undefined

//pages/program/[id].tsx

const Program:React.FC = ({data}:any) => {
    const router = useRouter();
    const {id} = router.query;
    console.log(data);
    const {photoUrl,displayModal,hideModal} = useModalDisplay();
    
    return(
        <>
           <ProgramDetailBody data={data} />            //このコンポーネントでエラー(コードは下）
           <PageTitle>Photo Gallery</PageTitle>
           <GallaryDisplay id={id} setModalHandler={displayModal}/>
           { photoUrl && <PhotoModal url={photoUrl} cancelHandler={hideModal} />}
        </>
    )
}

export default Program;


export const getStaticProps:GetStaticProps = async (ctx:any) => {
    const id = ctx.params.id;
    const res = await fetch(`http://api.tvmaze.com/shows/${id}`);
    const data = await res.json();
    return{
        props:{data},
        revalidate:12*60*60
    }
}

export const getStaticPaths = async () => {
    const d = new Date();
    const y = d.getFullYear();
    const m = String(d.getMonth() + 1).padStart(2,"0");
    const date = String(d.getDate()).padStart(2,"0");
    const res = await fetch(`http://api.tvmaze.com/schedule/web?date=${y}-${m}-${date}`);
    let dat = await res.json();
    const data = dat.filter((datum:any,index:number) => {
      return datum._embedded.show.image !== null && datum._embedded.show.schedule.time !== ""
    });
    let paths:any = [];
    data.forEach((datum:any) => {
        paths.push({params:{id:String(datum.id)}});
    });

    return {
        paths:paths,
        fallback:"blocking"
    }
}

import React from 'react';
import DetailImage from '../atoms/DetailImage';
import ProgramInfoWrapper from "../molecules/ProgramInfoWrapper";


const ProgramDetailBody:React.FC<any> = (props) => {
        let data = props.data;
        let src = props.data.image ? props.data.image.original : null
    return(
        <div className="w-95% m-topAuto lg:flex justify-between block relative min-h-70rem">
                        <DetailImage src={src} alt={props.data.name} />
                       <ProgramInfoWrapper 
                           name={props.data.name}
                          runtime={props.data.runtime} 
                           url={props.data.url}
                           officialSite={props.data.officialSite} 
                          language={props.data.language} 
                          summary={props.data.summary || "No Summary"} 
                           time={props.data.schedule.time}     //ここで エラー
                           days={props.data.schedule.days} />  //ここでもエラーが出る  
        </div>
    )
}

export default ProgramDetailBody;

{id: 53020, url: "https://www.tvmaze.com/shows/53020/rupauls-drag-race-down-under", name: "RuPaul's Drag Race Down Under", type: "Reality", language: "English", …}
averageRuntime: 53
dvdCountry: null
externals: {tvrage: null, thetvdb: 368747, imdb: "tt14192040"}
genres: []
id: 53020
image: {medium: "https://static.tvmaze.com/uploads/images/medium_portrait/305/763370.jpg", original: "https://static.tvmaze.com/uploads/images/original_untouched/305/763370.jpg"}
language: "English"
name: "RuPaul's Drag Race Down Under"
network: null
officialSite: "https://www.stan.com.au/watch/rupauls-drag-race-down-under"
premiered: "2021-03-05"
rating: {average: null}
runtime: 53
schedule: {time: "16:00", days: Array(1)}
status: "Running"
summary: "<p>Shantay, G'day! Time to tuck in your budgies Aussie queens, <b>RuPaul's Drag Race Down Under</b> is finally here! The fiercest Kiwi and Aussie queens will go head-to-head in the hopes of taking home the title of Down Under's first Drag Superstar.</p>"
type: "Reality"
updated: 1621115358
url: "https://www.tvmaze.com/shows/53020/rupauls-drag-race-down-under"
webChannel: {id: 64, name: "Stan", country: {…}}
weight: 97
_links: {self: {…}, previousepisode: {…}, nextepisode: {…}}
__proto__: Object

＜試したこと＞
一度、エラーが出たtimeとdaysの部分をprops.dataではなく定数を渡して(time = "foo"などとしました)動作を確認したところ正常に動作しました、props.data.scheduleのprops以外はしっかりと読み込まれるのですが、なぜなのでしょうか？
協力頼みます.

Answer 1

回答になるか分かりませんが、上手くいくかもしれないものを提示しておきます。

前提

Client(Chrome ブラウザ)で、 http://api.tvmaze.com/shows/53020 の schedule を確認できました。
pathsは、以下の値でした。

[
  { params: { id: '2055983' } },
  { params: { id: '2085298' } },
  { params: { id: '2085182' } },
  { params: { id: '2083741' } },
  { params: { id: '2039957' } },
  { params: { id: '2092326' } }
]

結論

1. サーバサイドの fetch() が問題かもしれないので、 node-fetch を使用してみるのはどうか？

2. http://api.tvmaze.com/shows/2055983 をアクセスしたら、 404 であるため、http://api.tvmaze.com/schedule/web?date=${y}-${m}-${date} の条件を変更してみるのはどうか？

3. デフォルト値を与えるやり方（props.data?.schedule?.days ?? new Date()） で、無理矢理エラーを回避するやり方

上手くいかなかったら、すみません　m(_ _)m

Comments

[gasuketu]

回答ありがとうございます。結論2.3はアプリケーションの都合上、今の時点では変更できない部分であったため、結論１を試しましたが同様のエラーが発生しました。なぜなのでしょう、、、