notion图床_教育优惠计划

2023-02-06

利用notion作为图床,获取图片引用的永久外链。简单的方法,页面公开后,浏览器隐私模式下访问,获取图片地址。复杂的,登录模式下,图片地址获取后手动修改。

引用一:Notion图床工具需求

源地址:Jerry Wang——Notion图床工具需求,有改动(节标题添加及节删除)。

可以自动化

建议集成到现有的工具中,如utools, picgo等其他工具,而不是做成一个单独的软件。可能用js做会好一点,但我对github上的Notion js轮子的功能不太了解

配置原理

个人的token_v2,这个不是永久的,一旦手动退出登录就会失效。但只要不手动推出登录就不会失效。作为图床的page的url,需要设置页面为公开可读。

手动操作步骤

  1. 复制图片到粘贴板,用token_v2模拟登录,上传图片到上面设置的公开图床page,并获取图片的亚马逊云地址。如:

    https://s3.us-west-2.amazonaws.com/secure.notion-static.com/69a955b1-7f22-4be3-84d0-e2a793bd1c69/Untitled.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAT73L2G45O3KS52Y5%2F20200806%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20200806T070327Z&X-Amz-Expires=86400&X-Amz-Signature=85ce8c6f5854690944199d85d0186ae129533f00adf71d31e30dccfd2e342722&X-Amz-SignedHeaders=host&response-content-disposition=filename%20%3D%22Untitled.png%22
    
  2. 转化为无token url。在上面的url中, Untitled.png 后面都去掉。然后把 / 替换为 %2F, : 替换为 %3A 。然后再整体的url前面加上https://www.notion.so/image/ 。例如,一个转化后的url为:

    https://www.notion.so/image/https%3A%2F%2Fs3.us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F69a955b1-7f22-4be3-84d0-e2a793bd1c69%2FUntitled.png
    

引用二——“Notion使用心得(2)—你的私人图床”

源地址:Mayne’s Blog——“Notion 使用心得(2)—你的私人图床”

notion 的付费用户可以无限制的上传图片,那么你的私人图床就来了。

优缺点

  1. 内容可控。增删改查都可以自己来。

  2. 服务稳定。你付钱给 notion,notion 付钱给亚马逊。无限存储(目前看来),比公共图床稳定多了。

  3. 访问不稳定。由于众所周知的原因,亚马逊的图片服务访问不怎么稳定,因为地区和网络环境的差异,有些地方或时间段可能无法正常访问(除了偶尔抽风,大部分时间都正常)。

构建一个图床

创建表格,最好是网格视图。你完全不需要配置任何东西。确保你的表格页面是公开的,其它人可以访问的。将图片拖入其中,自动就上传好了。

在隐身窗口下打开图床页面,点开图片,右键复制图片链接即可。

外链注意事项

notion使用的是亚马逊的存储服务。如果你以登录用户访问,查看图片时,链接是这样的:

https://s3.us-west-2.amazonaws.com/secure.notion-static.com/20d5720f-ff62-47f7-a827-7ea17ed9fba8/untitled?AWSAccessKeyId=ASIAT73L2G45O4BCQ4JZ&Expires=1551528594&Signature=Ns%2BKYeSR%2FBhkezc8MF8lPNgnTow%3D&response-content-disposition=filename%3D"untitled"-amz-security-token=FQoGZXIvYXdzEPr%2F%2F%2F%2F%2F%2F%2F%2F%2F%2FwEaDISznguQKC3MwayxlCK3A%2BV3a%2FMYCX09A8pvHzq3xXZzYC4d6x9zYYOrFqFAps0Yj8dgwL3eSQxH9NOpGc3OXjF0YFfcnhPp2U4p6XVKtAAi4lMsotKtrIGmqWBwEFbwSr%2FE9wueXOAv4UJMsL%2BPZyIdzwvkGR7PlGV9ftDozBPOHmHJApi7MxzehqWKlF9A%2FIoCKAGzvcQldSMJSbE%2FMkEksPeW1215McWUYP%2Fn%2FnpPi8hqWw5GqA3bnNZ%2BSxLe2eFKTJtByC%2FtkDsqTTqlmLo7HJqfN4RmyvHw11V6tuuL25lmr3C1mnhjaN1ZNoN1opmalcwcRj%2F1UmDprDRbhVCgq%2FIgtq4XPuubROk5V%2FQyCq9MS%2FYeeqAn2lsSAdFBEmmUrRSz1v%2Fa1SuwasPirZuMOrYi2fs4zAlByK5dYsoPRCwKzjCg7oDfa2%2BpkKl0rqHEx8WhEHvgK%2F7BZmCIHmuaqX1ppQ4ZGum22RFecYnO7xx1cbTmbBUuK3MGRGCUxsG0vXqWldD13kpMFlVsR7VXa3RaJHKZMfr8nbjnbJWvTKfGPDKamcJCAaKjcngbW9mETi%2B%2BvT%2FQf9WOSKzmkWMWFD4uoTYoqt3j4wU%3D

该链接有访问过期时间。所以当你把这个链接分享给别人时,过段时间可能就没法访问了。

隐身窗口下访问的图片链接是这样的:

https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F409273bd-a5ee-4045-8363-6723795858c9%2Fmy-octocat-1544438897338.png?width=1930

https://www.notion.so/image/原亚马逊链接存储链接(做一点处理)?width=宽度

通过控制宽度参数,可以获取自己想要size的图片。

注意这里不可以直接通过 encodeURIComponent(原始url) 做转换。

转换后的链接应该是 s3-us-west-2 ,而不是 s3.us-west-2

转换代码如下:

openUrl = encodeURIComponent("原图链接(不带token参数的)").replace("s3.us-west-2","s3-us-west-2")

在 aws 域下的图片都是带有 token 的,存在过期时间。所以图片链接无法作为固定链接使用,需要做上面提到的转换。

简单来说。非登录用户看到的图片链接有2种形式

png/jpeg/其它待考证的格式 —— 图片属于 notion 域下,可作为长期固定链接使用

gif/视频/其它待考证的格式—— 资源属于 aws 域下,携带token访问,不可直接作为固定链接,需要转换后才能使用。

详细转换代码参见https://github.com/mayneyao/notabase/blob/7aa5b10bf8992b0b586e98a56df5a41b95ce8c6c/src/utils.js#L37

个人使用场景

github 中一些项目的 readme 文档需要使用图片时,不想把图片加到git仓库里面。所以直接上传图片到图床,然后填网络链接即可。

似乎 github 还会做一层优化。查看图片时候,显示图片地址是 github 域下面的。