14
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

オレオレGyazoでスクショを瞬間共有

Last updated at Posted at 2019-12-21

はじめに

Gyazoというアプリケーションをご存知でしょうか。
「スクリーンショットの瞬間共有」というキャッチフレーズで、世界中で使われているハイパー売れっこアプリなため、もしかすると知らない人の方が少ないかもしれません。

ezgif-7-b03d809b641c.gif

↑このように、Gyazoのクライアントアプリを起動して範囲を選択すると、スクリーンショットが撮られてすぐにGyazoのサーバーにアップロードされます。
その後URLが返却され、ブラウザが開きすぐにアップロードされたスクリーンショットを確認することができ、他の人に共有する際はこのURLを共有するだけです。

通常スクリーンショットを共有しようとすると、撮る→端末に保存→アップロードといった流れになると思うと、非常に簡単に済みますね。
また、例えば表形式の資料で画像もつけたいといった場合でも、下記のように画像URLを貼り付けておくことで良い感じに収めることができます。

スクリーンショット 2019-12-21 16.38.26.png

この手軽さ便利さから、前に働いていた職場では非常に流行っており、あちこちから「ごめん、それちょっとGyazoってくんね」だとか「すぐにGyazoって送ります」「お前も結構Gyazoってきたね」だとか、とにかく「Gyazoる」という単語が飛び交っており、最終的にはただスマホで写真を撮る時にさえGyazoるとか言ってたくらいには中毒者が続出していました。
これに関しては、人によっては口に出すとちょっと気持ち良い響きなのが原因なのかもしれません。

問題点

ただ、このGyazo、無料で使おうとすると少し問題があります。
1 広告が結構邪魔
2 アップロードした画像は一般公開される
3 キャプチャしたものが一覧で見られる画面があるが、直近10件まで

上記の問題は有料版にすることで解決することができますが、お金を払ってGyazoライフを送れるようなイカした人はお洒落なオフィスで可愛いあの子とネスカフェアンバサー出来るような人間だと相場は決まっています。
私のように、会社に在籍する猫たちの飲み水をこっそり盗み飲むような人間には、中々真似することはできません。

有料版にせずとも、Gyazoサーバーを社内サーバー等に構築することでも解決が可能です。
これはオレオレGyazoとかいって、割と有名らしいです。
Gyazoはサーバー、クライアントと2つのアプリケーションで動いているのですが、実は両方ともソースコードが公開されています。
サーバー側はRubyで書かれているCGIスクリプトを少し変更して配置すれば良く、クライアント側はmacであればスクリプトを少し弄るだけでオレオレGyazoの環境は完成します。

ちなみに

キャプチャしたものが一覧で見られる画面があるが、直近10件まで

こちらの問題に関してですが、オレオレGyazoだと公式と違ってそもそも一覧画面がありません。
ただ、画像は自分のサーバーに置かれるため、一覧画面など欲しい機能は自作することで好きなように対応することができます。

オレオレGyazoのやり方は調べれば割と色々出てきますが、基本的に流れとしては
apacheをインストール→サーバーのスクリプトを取ってきて配置といった流れになるかと思います
試しにEC2に作ってみると、思いの外あっさりと出来てしまいました。
同じようにやり方を書くのもつまらないと思ったため、今回はEC2で行った流れを元にDocker化し、ローカルやら他の環境でもパパッとビルドしてシュルっと試せるようにしてみました。

サーバー側用意

サーバー側の動作としては、クライアントから送信されてきた画像を保存し、そのURLを返すというシンプルなものになっております。
とりあえずローカルで動くように書いたDockerfileが下記となります。

FROM	centos:centos7
#諸々インストール
RUN		yum update -y && yum clean all \
			&& yum -y install ruby \
			&& yum -y install wget \
			&& yum install -y httpd && yum clean all
#適当になんか入れとく
RUN		echo "I was the god of Gyazo" > /var/www/html/index.html
#gyazoサーバースクリプト等配置
WORKDIR	/var/www/cgi-bin/
RUN		wget https://raw.github.com/gyazo/Gyazo/master/Server/upload.cgi \
			&& chmod +x upload.cgi
WORKDIR	/var/www/
RUN		mkdir cgi-bin/db \
			&& mkdir html/data \
			&& chmod 777 cgi-bin/db \
			&& chmod 777 html/data
#ファイルをちょこっと書き換える
RUN 	sed -i -e "s/#AddHandler cgi-script/AddHandler cgi-script/" /etc/httpd/conf/httpd.conf
WORKDIR	/var/www/cgi-bin/
RUN		sed -i -e "s/usr\/bin\/env ruby/usr\/bin\/ruby/" upload.cgi \
			&& sed -i -e "s/data\/#{hash}.png/..\/html\/data\/#{hash}.png/" upload.cgi \
			&& sed -i -e "s/gyazo.com/localhost\/data/" upload.cgi
RUN		systemctl enable httpd
EXPOSE		80

dockerの入った環境で、どこでも良いので上記ファイルを置き、ビルドします↓

docker build --rm -t gyazo .

gyazoという名前でイメージができました。
これを起動します。

docker run -d --privileged --name gyazo -i -t -p 80:80 gyazo /sbin/init

これでサーバーが立ち上がります。
ブラウザから http://localhost/ にアクセスてしてみて、「I was the god of Gyazo」とか出ていたら成功です。
これでサーバー側は完成です。
立ち上がっていなかったら・・・ちょっとよく分かりません。
コンテナとかイメージを削除して再ビルドとかしてみたら上手くいくんじゃないでしょーか。

クライアント側用意

続いて、クライアント側の用意をします。
MacとWindowsでやり方が違うのですが、私はMacでしか試していないためここではMacのやり方を載せます。
Windowsのやり方は、「Gyazo 自分のサーバーで」等で検索してみたりで探してみてください。(少し情報が古いものが多いため、ちゃんと動作するかは分かりません)
Macだとクライアントはシェルスクリプトで書かれているらしく、直接アップロード先等を書き換えるだけで良いようです。

クライアントアプリ自体はホームページからダウンロード、インストールします。
こちらからダウンロードします。
https://gyazo.com/

その後、
/Applications/Gyazo.app/Contents/Resources/
にあるscriptというファイルを開き、送信先の設定である下記の2点を書き換えます。

HOST = 'upload.gyazo.com'
↓
HOST = 'localhost'
CGI = '/upload.cgi'
↓
CGI = '/cgi-bin/upload.cgi'

さらに、Gyazoはある時からデフォルトだとhttpsで通信を利用するようになっているらしいです。
そのためサーバー側にSSLの証明書の設置が必要となりますが、とりあえず動かしたいので、その辺もスクリプトを弄って何とかします。

PORT = 443
↓
PORT = 80

※ポートに関しては、dockerコンテナ立ち上げ時に違うポート番号で立ち上げている場合は、そのポート番号を指定します。

http.use_ssl = true
↓
http.use_ssl = false

これで動くようになりました。

190394147.gif

邪魔な広告がないのと、本家と比べるとだいぶ動作が軽くなりました。おそらく余分なスクリプト等が走っていないためだと思われます。正直、個人的にはこれがオレオレGyazoで一番嬉しい所です。
試しにEC2インスタンスでやってみても動きました。Dockerなので他の環境でも多分問題ないはず。

これによって一瞬でスクリーンショットを共有することで、非常にスマートな印象を与えられます。気になるあの子に披露して見せたら、感涙に咽びながらクリスマスを共に過ごしてくれること間違いなしです。
ただ、apacheでCGIを動かして〜といったことは少々古めかしいらしく、最近だとサーバーレスとかでやったほうがナウいっぽいみたいです。(ナウいはダサいの対義語です)

皆様も今日から素敵なGyazoライフをお過ごし下さいませ。

14
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
14
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?