FullcalendarのGoogle Calendar連携で見落としたこと

サイト構築ではWordpressの管理者でログインして編集するのが普通です。そうじゃなきゃいろいろできないですからね。
で、今回のFullcalendar実装もそうしていたわけです。
プレビューももちろんログインしたまま。
なんならテストで見ていたiPadもログインしたままですよ。

それがいけなかった…

実装してから2週間ほど経過して、おもむろにiPhoneでサイトを見てみると…
あれ?カレンダーにスケジュールが表示されていない…

PCで確認すると表示されている!

これは…汗

まず疑ったのは設定の記述。
でもPC(Chrome)では表示されるのに、スマホ(Safari)では表示されないってことは、基本的に記述はあってるはず…と思いつつも見返す。
うーん。やっぱりおかしいところはない。

次にSafari独特の記述が必要なのか?ということ。
実は今回Fullcalendarは、2ヶ所のサイトで設置してました。
片方のサイトでは表示され、もう一方は表示されていなかったのです。
※あとで分かったのですが、これが混迷した一番の原因(T_T)

改めてネットで調べても同じような症状が出てきません。
ここで一旦整理してみましょう。

  1. Aサイトでカレンダーが表示されるもののスケジュールが表示されない。Bサイトではスケジュールがしっかり表示される。
  2. どうやらSafariで表示されない。スマホもPCもSafariでは表示されない。
  3. iPadでAサイトだけSafariで表示される。Bサイトはダメ
  4. あれ?

……

そういえばwordpressにログインしている…
見れるやつは…
Safariでも…

試しにSafariで見れていたiPadで、wordpressからログアウトしてみます。

すると…スケジュールが表示されない…

管理者権限!?
でもwordpressの権限で見られなくなるならカレンダーごとじゃね?

で思いつくのはGoogle Calendarの公開レベルです。
もちろん対象のカレンダーは一般公開にしてあります。

そう。
原因はGoogle CalendarのAPI設定です。
キー制限としてHTTPリファラを指定し、対象URLを指定するんですが…



ドメインとすべてのフォルダーが対象になるようにと上図のように記述しました。

それを

こう書き換えたのです。
※わかっているとは思いますがSSL設定してない場合は「http://」です。多分省略可。

するとどうでしょう(BGMはビフォーアフターで)
今まで見ることができなかったスケジュールが表示されました♪

ということで改めて確認してみると、iPadでアクセスしていたのは「www」付きだったのです。
なんて凡ミス…

wordpressのログイン前は「https://www.hogehogeA.biz」にアクセスしていてスケジュールが見えず、ログインして何かしら修正作業してプレビューする時に管理画面から「サイトを表示する」にすると、wordpressの「設定」ー「一般」でサイトURLとかをwwwなしに設定しているから「https://hogehogeA.biz」でアクセスしていたわけです。そうするとスケジュールはGoogle Calendar APIの認証設定によって表示できるわけです。

つまり、https://*.hogehoge.com/* の一文だけでいいのかもしれません。
↑だめでした(´・ω・`)
www付きをリダイレクトして「なしURL」に飛ばしていればいいのでしょうが、AサイトもBサイトもしてないので、結局この形で設定しています。

サイトの立ち上げで、最初からURLの公開を https://hogehoge.com にしていればなんの問題も起きないのでしょうが、上図の記述で設定しておけば間違いがないわけです。

軽く沼に入ったので書き留めておきます(・∀・)