search

otoyo / astro-notion-blog

🚀 Begin building your very own Notion Blog with Astro.
https://astro-notion-blog.pages.dev/
MIT License
766 stars 499 forks source link

Web Bookmark が文字化けする #159

Closed kromiii closed 1 year ago

kromiii commented 1 year ago

不具合の概要

notion で作成した Web Bookmark に日本語が含まれていると Cloudflare で build した際に文字化けする

再現方法

notion で Web Bookmark を作成する（この時点では文字化けしていない）

image

localhost で確認する（画像は表示されなくなってしまうが文字化けはしていない）

image

Cloudflare でデプロイ後（文字化けしてしまっている）

image

不具合が発生しているサイト：https://kromiii.info/posts/afraid-from-freedom/

エラーログ

ブラウザの開発者コンソールでのログはなし

Cloudflare のログ

2023-08-18T15:17:15.204733Z Cloning repository...
2023-08-18T15:17:16.056168Z From https://github.com/kromiii/astro-notion-blog
2023-08-18T15:17:16.056906Z  * branch            b0e916c82680ede3ed1eb12239cfcd49d20ef20c -> FETCH_HEAD
2023-08-18T15:17:16.0571Z   
2023-08-18T15:17:16.131777Z HEAD is now at b0e916c change deploy schedule
2023-08-18T15:17:16.13244Z  
2023-08-18T15:17:16.247008Z 
2023-08-18T15:17:16.280562Z Success: Finished cloning repository files
2023-08-18T15:17:16.93758Z  Detected the following tools from environment: nodejs@18.16.0, npm@9.5.1
2023-08-18T15:17:16.938343Z Installing nodejs 18.16.0
2023-08-18T15:17:18.074075Z Trying to update node-build... ok
2023-08-18T15:17:18.363367Z Downloading node-v18.16.0-linux-x64.tar.gz...
2023-08-18T15:17:18.363928Z -> https://nodejs.org/dist/v18.16.0/node-v18.16.0-linux-x64.tar.gz
2023-08-18T15:17:20.138495Z Installing node-v18.16.0-linux-x64...
2023-08-18T15:17:21.699011Z Installed node-v18.16.0-linux-x64 to /opt/buildhome/.asdf/installs/nodejs/18.16.0
2023-08-18T15:17:21.699592Z 
2023-08-18T15:17:23.176099Z Installing project dependencies: npm clean-install --progress=false
2023-08-18T15:17:31.381227Z npm WARN deprecated @npmcli/move-file@2.0.1: This functionality has been moved to @npmcli/fs
2023-08-18T15:17:40.394553Z 
2023-08-18T15:17:40.39517Z  added 854 packages, and audited 855 packages in 16s
2023-08-18T15:17:40.395375Z 
2023-08-18T15:17:40.395525Z 235 packages are looking for funding
2023-08-18T15:17:40.395658Z   run `npm fund` for details
2023-08-18T15:17:40.431101Z 
2023-08-18T15:17:40.431527Z 7 vulnerabilities (6 moderate, 1 high)
2023-08-18T15:17:40.431793Z 
2023-08-18T15:17:40.432027Z To address issues that do not require attention, run:
2023-08-18T15:17:40.432264Z   npm audit fix
2023-08-18T15:17:40.432531Z 
2023-08-18T15:17:40.432707Z To address all issues (including breaking changes), run:
2023-08-18T15:17:40.432894Z   npm audit fix --force
2023-08-18T15:17:40.433065Z 
2023-08-18T15:17:40.43328Z  Run `npm audit` for details.
2023-08-18T15:17:40.457975Z Executing user command: npm run build
2023-08-18T15:17:41.498302Z 
2023-08-18T15:17:41.498661Z > astro-notion-blog@0.6.3 build
2023-08-18T15:17:41.498858Z > astro build
2023-08-18T15:17:41.499007Z 
2023-08-18T15:17:43.677382Z 03:17:43 PM [content] No content directory found. Skipping type generation.
2023-08-18T15:17:43.941079Z 03:17:43 PM [build] output target: static
2023-08-18T15:17:43.941602Z 03:17:43 PM [build] Collecting build info...
2023-08-18T15:17:43.942466Z 03:17:43 PM [build] Completed in 327ms.
2023-08-18T15:17:43.943836Z 03:17:43 PM [build] Building static entrypoints...
2023-08-18T15:17:47.909732Z 03:17:47 PM [build] Completed in 3.97s.
2023-08-18T15:17:47.9105Z   
2023-08-18T15:17:47.910732Z  building client 
2023-08-18T15:18:03.526659Z 
2023-08-18T15:18:03.527425Z (!) Some chunks are larger than 500 kBs after minification. Consider:
2023-08-18T15:18:03.527644Z - Using dynamic import() to code-split the application
2023-08-18T15:18:03.527812Z - Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
2023-08-18T15:18:03.527979Z - Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
2023-08-18T15:18:03.528188Z Completed in 15.62s.
2023-08-18T15:18:03.528329Z 
2023-08-18T15:18:03.52868Z  
2023-08-18T15:18:03.529006Z  generating static routes 
2023-08-18T15:18:03.550622Z ▶ src/pages/index.astro
2023-08-18T15:18:04.468442Z   └─ /index.html (+0.93s)
2023-08-18T15:18:04.471102Z ▶ src/pages/posts/page/[page].astro
2023-08-18T15:18:04.474353Z ▶ src/pages/posts/tag/[tag]/page/[page].astro
2023-08-18T15:18:04.48073Z  ▶ src/pages/posts/tag/[tag].astro
2023-08-18T15:18:04.499255Z   ├─ /posts/tag/Book/index.html (+19ms)
2023-08-18T15:18:04.519178Z   ├─ /posts/tag/Diary/index.html (+42ms)
2023-08-18T15:18:04.527407Z   ├─ /posts/tag/Health/index.html (+51ms)
2023-08-18T15:18:04.5402Z     ├─ /posts/tag/Introduction/index.html (+63ms)
2023-08-18T15:18:04.549543Z   └─ /posts/tag/ガジェット/index.html (+73ms)
2023-08-18T15:18:05.4065Z   ▶ src/pages/posts/[slug].astro
2023-08-18T15:18:06.057932Z   ├─ /posts/afraid-from-freedom/index.html (+1.51s)
2023-08-18T15:18:06.730266Z   ├─ /posts/necessity-of-monitor/index.html (+2.18s)
2023-08-18T15:18:07.228487Z   ├─ /posts/tips-of-continue/index.html (+2.68s)
2023-08-18T15:18:08.714967Z   ├─ /posts/dangers-of-sitting/index.html (+4.16s)
2023-08-18T15:18:10.310294Z   ├─ /posts/jodein-takaraduka/index.html (+5.76s)
2023-08-18T15:18:10.949217Z   ├─ /posts/publications/index.html (+6.40s)
2023-08-18T15:18:12.733049Z   └─ /posts/self-introduction/index.html (+8.18s)
2023-08-18T15:18:12.758051Z λ src/pages/feed.ts
2023-08-18T15:18:12.764233Z   └─ /feed (+28ms)
2023-08-18T15:18:12.76522Z  Completed in 9.24s.
2023-08-18T15:18:12.765668Z 
2023-08-18T15:18:12.889161Z cp: cannot stat 'public/notion/*': No such file or directory
2023-08-18T15:18:12.892674Z 03:18:12 PM [build] 13 page(s) built in 29.28s
2023-08-18T15:18:12.892965Z 03:18:12 PM [build] Complete!
2023-08-18T15:18:12.938946Z Finished
2023-08-18T15:18:12.93979Z  Note: No functions dir at /functions found. Skipping.
2023-08-18T15:18:12.940017Z Validating asset output directory
2023-08-18T15:18:13.630531Z Deploying your site to Cloudflare's global network...
2023-08-18T15:18:16.884998Z Uploading... (47/57)
2023-08-18T15:18:17.581794Z Uploading... (50/57)
2023-08-18T15:18:20.390693Z Uploading... (53/57)
2023-08-18T15:18:34.562571Z Uploading... (57/57)
2023-08-18T15:18:34.56296Z  ✨ Success! Uploaded 10 files (47 already uploaded) (18.82 sec)
2023-08-18T15:18:34.563195Z 
2023-08-18T15:18:34.84968Z  ✨ Upload complete!
2023-08-18T15:18:36.983615Z Success: Assets published!
2023-08-18T15:18:37.71686Z  Success: Your site was deployed!

期待する挙動

Web Bookmark に日本語が含まれていても文字化けしない （できれば）Notion に含まれる画像も正しく表示される

リポジトリとブランチ名

https://github.com/kromiii/astro-notion-blog

デスクトップ環境

追加情報

特になし

otoyo commented 1 year ago

@kromiii ご報告ありがとうございます。 ローカルでは再現せず、Cloudflare でのみ再現するとのこと承知しました。 Cloudflare での文字化けは毎回発生しますでしょうか？それとも文字化けしないときもありますか？

kromiii commented 1 year ago

amazon の Web bookmark は毎回文字化けするか説明文が空欄になります。amazonのリンク以外（Youtubeなど）は文字化けしないです。

otoyo commented 1 year ago

@kromiii 詳細ありがとうございます。 時間はかかると思いますが調査してみます。

otoyo commented 1 year ago

@kromiii https://github.com/otoyo/astro-notion-blog/pull/160 で修正したので最新のmainブランチを取り込んでご確認ください。

kromiii commented 1 year ago

ありがとうございます。取り込んで再度デプロイしてみました。 文字化けは無くなったのですが、WebBookmark が白紙になってしまいました。

image

一応デプロイ時のログも共有します。

2023-08-22T23:53:16.986104Z Cloning repository...
2023-08-22T23:53:17.825253Z From https://github.com/kromiii/astro-notion-blog
2023-08-22T23:53:17.825936Z  * branch            36bd6f63de1da821cd1d11d3c4cf4125ff1309bf -> FETCH_HEAD
2023-08-22T23:53:17.826168Z 
2023-08-22T23:53:17.898942Z HEAD is now at 36bd6f6 Merge pull request #1 from otoyo/main
2023-08-22T23:53:17.899714Z 
2023-08-22T23:53:18.014763Z 
2023-08-22T23:53:18.04755Z  Success: Finished cloning repository files
2023-08-22T23:53:18.773104Z Detected the following tools from environment: nodejs@18.16.0, npm@9.5.1
2023-08-22T23:53:18.773832Z Installing nodejs 18.16.0
2023-08-22T23:53:19.97524Z  Trying to update node-build... ok
2023-08-22T23:53:20.263329Z Downloading node-v18.16.0-linux-x64.tar.gz...
2023-08-22T23:53:20.263693Z -> https://nodejs.org/dist/v18.16.0/node-v18.16.0-linux-x64.tar.gz
2023-08-22T23:53:22.029105Z Installing node-v18.16.0-linux-x64...
2023-08-22T23:53:23.57345Z  Installed node-v18.16.0-linux-x64 to /opt/buildhome/.asdf/installs/nodejs/18.16.0
2023-08-22T23:53:23.574015Z 
2023-08-22T23:53:25.01147Z  Installing project dependencies: npm clean-install --progress=false
2023-08-22T23:53:44.378454Z 
2023-08-22T23:53:44.379201Z added 874 packages, and audited 875 packages in 18s
2023-08-22T23:53:44.379506Z 
2023-08-22T23:53:44.37971Z  241 packages are looking for funding
2023-08-22T23:53:44.379946Z   run `npm fund` for details
2023-08-22T23:53:44.41493Z  
2023-08-22T23:53:44.415326Z 6 vulnerabilities (5 moderate, 1 high)
2023-08-22T23:53:44.415563Z 
2023-08-22T23:53:44.415719Z To address issues that do not require attention, run:
2023-08-22T23:53:44.415868Z   npm audit fix
2023-08-22T23:53:44.416023Z 
2023-08-22T23:53:44.416201Z To address all issues (including breaking changes), run:
2023-08-22T23:53:44.416343Z   npm audit fix --force
2023-08-22T23:53:44.416479Z 
2023-08-22T23:53:44.41661Z  Run `npm audit` for details.
2023-08-22T23:53:44.441054Z Executing user command: npm run build
2023-08-22T23:53:45.44888Z  
2023-08-22T23:53:45.449428Z > astro-notion-blog@0.6.3 build
2023-08-22T23:53:45.449687Z > astro build
2023-08-22T23:53:45.449858Z 
2023-08-22T23:53:47.579789Z 11:53:47 PM [content] No content directory found. Skipping type generation.
2023-08-22T23:53:47.827286Z 11:53:47 PM [build] output target: static
2023-08-22T23:53:47.827703Z 11:53:47 PM [build] Collecting build info...
2023-08-22T23:53:47.828378Z 11:53:47 PM [build] Completed in 312ms.
2023-08-22T23:53:47.829689Z 11:53:47 PM [build] Building static entrypoints...
2023-08-22T23:53:51.929536Z 11:53:51 PM [build] Completed in 4.10s.
2023-08-22T23:53:51.930216Z 
2023-08-22T23:53:51.930433Z  building client 
2023-08-22T23:54:07.835745Z 
2023-08-22T23:54:07.83654Z  (!) Some chunks are larger than 500 kBs after minification. Consider:
2023-08-22T23:54:07.836749Z - Using dynamic import() to code-split the application
2023-08-22T23:54:07.836895Z - Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
2023-08-22T23:54:07.837099Z - Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
2023-08-22T23:54:07.837283Z Completed in 15.91s.
2023-08-22T23:54:07.837452Z 
2023-08-22T23:54:07.837593Z 
2023-08-22T23:54:07.837726Z  generating static routes 
2023-08-22T23:54:07.857446Z ▶ src/pages/index.astro
2023-08-22T23:54:08.965266Z   └─ /index.html (+1.12s)
2023-08-22T23:54:08.967926Z ▶ src/pages/posts/page/[page].astro
2023-08-22T23:54:08.994207Z   └─ /posts/page/2/index.html (+27ms)
2023-08-22T23:54:08.997544Z ▶ src/pages/posts/tag/[tag]/page/[page].astro
2023-08-22T23:54:09.004935Z ▶ src/pages/posts/tag/[tag].astro
2023-08-22T23:54:09.01732Z    ├─ /posts/tag/Book/index.html (+17ms)
2023-08-22T23:54:09.039715Z   ├─ /posts/tag/Diary/index.html (+40ms)
2023-08-22T23:54:09.048402Z   ├─ /posts/tag/Food/index.html (+48ms)
2023-08-22T23:54:09.060535Z   ├─ /posts/tag/Health/index.html (+60ms)
2023-08-22T23:54:09.071014Z   ├─ /posts/tag/Introduction/index.html (+71ms)
2023-08-22T23:54:09.079079Z   ├─ /posts/tag/Life/index.html (+79ms)
2023-08-22T23:54:09.091643Z   ├─ /posts/tag/ガジェット/index.html (+92ms)
2023-08-22T23:54:09.099486Z   └─ /posts/tag/読書/index.html (+99ms)
2023-08-22T23:54:09.973949Z ▶ src/pages/posts/[slug].astro
2023-08-22T23:54:10.807347Z   ├─ /posts/yukyu-quiz-bite/index.html (+1.70s)
2023-08-22T23:54:11.824468Z   ├─ /posts/handdrip-coffee/index.html (+2.72s)
2023-08-22T23:54:12.355818Z   ├─ /posts/return-to-papers/index.html (+3.25s)
2023-08-22T23:54:13.091781Z   ├─ /posts/two-types-of-minimalist/index.html (+3.99s)
2023-08-22T23:54:13.569251Z   ├─ /posts/afraid-from-freedom/index.html (+4.47s)
2023-08-22T23:54:13.803181Z   ├─ /posts/necessity-of-monitor/index.html (+4.70s)
2023-08-22T23:54:14.263689Z   ├─ /posts/tips-of-continue/index.html (+5.16s)
2023-08-22T23:54:16.246371Z   ├─ /posts/dangers-of-sitting/index.html (+7.14s)
2023-08-22T23:54:17.505015Z   ├─ /posts/jodein-takaraduka/index.html (+8.40s)
2023-08-22T23:54:18.161023Z   ├─ /posts/publications/index.html (+9.06s)
2023-08-22T23:54:23.155474Z   └─ /posts/self-introduction/index.html (+14.05s)
2023-08-22T23:54:23.179108Z λ src/pages/feed.ts
2023-08-22T23:54:23.186225Z   └─ /feed (+28ms)
2023-08-22T23:54:23.186748Z Completed in 15.35s.
2023-08-22T23:54:23.186977Z 
2023-08-22T23:54:23.315175Z cp: cannot stat 'public/notion/*': No such file or directory
2023-08-22T23:54:23.3205Z   11:54:23 PM [build] 21 page(s) built in 35.80s
2023-08-22T23:54:23.320974Z 11:54:23 PM [build] Complete!
2023-08-22T23:54:23.36846Z  Finished
2023-08-22T23:54:23.369435Z Note: No functions dir at /functions found. Skipping.
2023-08-22T23:54:23.369731Z Validating asset output directory
2023-08-22T23:54:24.16109Z  Deploying your site to Cloudflare's global network...
2023-08-22T23:54:26.788664Z Uploading... (65/65)
2023-08-22T23:54:26.789614Z ✨ Success! Uploaded 0 files (65 already uploaded) (0.47 sec)
2023-08-22T23:54:26.789859Z 
2023-08-22T23:54:27.066216Z ✨ Upload complete!
2023-08-22T23:54:29.000525Z Success: Assets published!
2023-08-22T23:54:29.676794Z Success: Your site was deployed!
otoyo commented 1 year ago

確かに真っ白になっていますね。。 ローカルだと正常に動作するのに謎ですね。。

kromiii commented 1 year ago

はい、でも @otoyo さんの対応感謝です 🙏

otoyo commented 1 year ago

@kromiii ブックマークを生成する際にクラウドサービスからAmazonへのアクセスがブロックされているようでした。。

2023-08-23T00:18:02.42121766Z   <!--
2023-08-23T00:18:02.421320441Z          To discuss automated access to Amazon data please contact api-services-support@amazon.com.
2023-08-23T00:18:02.421441327Z          For information about migrating to our APIs refer to our Marketplace APIs at https://developer.amazonservices.jp/ref=rm_5_sv, or our Product Advertising API at https://affiliate.amazon.co.jp/gp/advertising/api/detail/main.html/ref=r
m_5_ac for advertising use cases.
2023-08-23T00:18:02.42213467Z   -->

Notionで表示されるのはNotionがAmazon のAPIを契約しているからな気がします。

真っ白な表示はさすがに見た目が悪いのでちょっとどうするか考えますね。

otoyo commented 1 year ago

@kromiii Amazon APIを使うには個人で利用開始申請をしなければいけなかったのでやはりダメでした。 消極的ですが、Amazonリンクはブックマークの対象外とする方向で対応しました。 https://github.com/otoyo/astro-notion-blog/pull/163

Amazonの場合はテキストリンクを使用いただければと思います。

kromiii commented 1 year ago

@otoyo ありがとうございます。ご対応感謝します 🙏