flarum通过反代使用Imgur上传图片

本文教你如何在无法访问Imgur时通过反代以实现在flarum论坛上使用imgur上传图片功能

前言:准备ID

启用扩展后,系统会提示您设置 Imgur 客户端 ID。您可以在这里用您的 Imgur 账号获取一个。请务必在表格中选择 「Anonymous usage without user authorization」。另外需要注意的是,界面上显然有一个BUG,所以你可能需要选择第二个选项,然后再选择第三个选项,否则会被要求填写「授权回调URL」。如果你在创建开发应用时遇到问题,请在国际社区回复,原作者帮助你。 ——来自https://discuss.flarum.org.cn/d/1786

nginx搭建反代

具体的内容可以参考搜索引擎和这篇文章中的nginx部分。这里简单说一下要点:

  • 建议反代地址和论坛使用同一域名。如果你的论坛是https://论坛.域名.com的话最好把反代地址设置为类似https://论坛.域名.com/imgur的形式。
  • 多在生产环境做测试,以免出现问题
  • 注意是否多加/漏写了斜杠

下面分享一下我的配置:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
location ^~ /imgur/ {
proxy_pass https://i.imgur.com/;
proxy_buffering off;
proxy_set_header Referer "";
proxy_set_header User-Agent "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36";
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Upgrade "websocket";
proxy_set_header Connection "Upgrade";
# 取消下面的注释可以启用 Nginx 缓存
#proxy_cache STATIC;
#proxy_cache_key $uri;
#proxy_cache_valid 200 30d;
#proxy_cache_use_stale error timeout invalid_header updating
# http_500 http_502 http_503 http_504;
#add_header X-Nginx-Cache $upstream_cache_status;
}

# API 镜像
location ^~ /imgur-api/ {
# 跨域,注意不要和前面的跨域策略冲突/重复
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers'
'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';

proxy_pass https://api.imgur.com/;
proxy_buffering off;
proxy_set_header Referer "";
proxy_set_header User-Agent "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36";
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Upgrade "websocket";
proxy_set_header Connection "Upgrade";
}

在nginx主管https://论坛.域名.com的配置文件处加上反代行后记得重启nginx并进行测试。这里实际上是代理了两个地方:api上传处和图片显示处

部署到flarum使用

安装原版插件

请先按照imgur插件发布地址内所述的安装方式安装原版插件。一般情况下就是一行composer require matteocontrini/flarum-imgur-upload

安装改版覆盖

笔者fork并制作了一个改版。请用它来覆盖原版插件目录。具体可通过以下方式进行:

  1. 进入/到flarum安装目录/vendor/matteocontrini/ 并删除flarum-imgur-upload文件夹
  2. git clone https://github.com/LCinHK/flarum-imgur-upload.git 生成新的文件夹

使用

在admin管理页,先清除一遍缓存再进入插件页点击imgur-upload插件的设置,应该出现以下内容,否则请检查上一步是否有做错地方。
设置

请将https://api.imgur.com/3/imagehttps://i.imgur.com 修改为你一一对应的反代地址。注意是否多加/漏写了斜杠。

效果

原生

效果与没改之前应该是一模一样的。

欢迎关注我的其它发布渠道