Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/Add the file block #51

Closed
wants to merge 4 commits into from

Conversation

trickstar13
Copy link
Contributor

先ほどはファイル期限についてアドバイスいただきありがとうございました🙏
Fileブロックを表示できるようにしました。

Notionのネイティブアプリのように、ファイル名をクリックでダウンロードさせたかったのですが、ウェブでは同一ドメイン間でないとダウンロードさせられない仕様とのことで、ファイル名をクリックすると別窓でリンク先のファイルが開きます。
SCR-20230212-o1m

アイコンは絵文字で対応しました。
もし今後、Notionの純正のIcons↓等に対応するようでしたら(できるのかは謎です・汗)、そのバリエーションからもっと適切なアイコンに差し替えても良いと思います。
SCR-20230212-p7n

@otoyo
Copy link
Owner

otoyo commented Feb 12, 2023

PRありがとうございます!

ファイルブロックの対応で一つ懸念なのが、ビルド時にURLを取得したとしてもいずれ期限が来てしまうことなんですよね。
今Notion APIのドキュメントを確認したところ期限は1時間のようでした。
https://developers.notion.com/reference/file-object#notion-hosted-files

ファイルの種類がわかれば画像ブロックでやっているようにデータURIスキームを使ってページに埋め込んでしまうことで回避できるのですが、Notion APIの定義を見る限りファイルの種類が何かというのはわからないみたいなんです(ファイル名の拡張子を見ればというのもありますが偽装することも可能なので)。

NotionにはPDFブロックがあるので、これらを踏まえてPDFファイルのみデータURIスキームで対応するというのが良さそうな落し所かなと思っています。
他のアイデアとしては #46 でOG画像をCloudinaryにホストしているように、ファイルをホストできるサービスを探すとかでしょうか。
いかがでしょうか?

@otoyo
Copy link
Owner

otoyo commented Feb 12, 2023

Notion APIの定義を見る限りファイルの種類が何かというのはわからないみたいなんです

と思ったのですが、もしかしたらS3のファイルをfetchしたときにそのレスポンスヘッダのContent-Typeを見るとわかるかもしれませんね。

@otoyo
Copy link
Owner

otoyo commented Feb 12, 2023

ビルドの前処理でファイルブロックのファイルを public/ 以下の適当なディレクトリにダウンロードしてしまうという方法を思いつきました。
これなら期限の問題も回避できそうです。

@trickstar13
Copy link
Contributor Author

ご検討ありがとうございました!色々と立ちはだかっているのですね、難しいです。汗
もしファイルダウンロードが可能ならそれが良さそうですね。あまり重いファイルは置かないように注意する必要はありそうです(転送量が…)

Astro2.0からはハイブリッドレンダリングも可能なので、エンドポイントではSSRを有効にしつつ(他の全てのページはSSGにして)、「CAPTCHA(キャプチャ)の検証」のような形で動的にURLを取得できないかなとも考えています。
この方法ならCORSにならずにURLを取得できるかな?と。
ファイル名は(自称ですが)ビルド時にも取得できるので、ダウンロードリンクを押した時点で自前のエンドポイントにアクセスして、そこからファイルのURLを持ってこられたらな、と。

@otoyo
Copy link
Owner

otoyo commented Feb 13, 2023

ダウンロードリンクを押した時点で自前のエンドポイントにアクセスして、そこからファイルのURLを持ってこられたら

これすごく良いアイデアですね!ビルド時間も長くならないですし、ファイルのダウンロードリンクを押したときに裏でAPI通信をして多少時間がかかったとしてもユーザー体験的には問題にならないと思うので、この方向で実現できるようにちょっとspec書いてみようと思います!

そしてタイミング良いことにastro-notion-blogのバージョン0.3ブランチはすでにAstro 2.0にしてあります!
#45

@otoyo otoyo mentioned this pull request Feb 13, 2023
3 tasks
}
}

export interface External {
Url: string
ExpiryTime?: string
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://developers.notion.com/reference/file-object
type: external の場合は expiry_time 持たなそうです。

@otoyo
Copy link
Owner

otoyo commented Feb 13, 2023

#53 でspecを書いてみたので良かったらご確認いただきコメントあればいただけますと幸いです。
さらにもし良ければ作るところも手伝っていただけますと非常にうれしいです。
その際は #45 からブランチを切っていただけますと幸いです(Fileブロックのサポートをバージョン0.3に組み込むことにしました)。

@trickstar13
Copy link
Contributor Author

ご対応ありがとうございます!specばっちりかと思います🚀
私の方が今週は時間が空かなさそうなため、otoyoさんにこのまま進めていただく方が早く進むかも知れません🙏汗

@otoyo
Copy link
Owner

otoyo commented Feb 13, 2023

@trickstar13 ご確認ありがとうございます!承知しました。では私の方で進めます〜 🙏

@otoyo otoyo closed this Feb 13, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants