Vivaldiで使えないCanvaを使用できるようにする方法

私はウェブブラウザ「Vivaldi（ヴィヴァルディ）」を愛用しています。

機能的なところやオススメポイントはこちらの記事で紹介していますので、時間があればご覧ください。

Vivaldiはブロガーにオススメな神ブラウザだった

さて、そんなVivaldiに大きな欠点があります。

Web上で画像を作成・編集できるツール「Canva（キャンバ）」が使えないのです。

非常に多くのクリエイターがアイキャッチなどの作成に使う便利なサイトなんですが、これを使えないのは痛い…。

私は今までわざわざGoogleChromeを開いてCanvaを使用しておりましたが、Vivaldiで使用する方法を見つけましたので紹介したいと思います。

VivaldiでCanvaが使えない原因

Vivaldiの公式フォーラムでも「Canvaが使えない」というスレッド（リンク先英文）が立っておりました。

ウェブブラウザには「UserAgent」というブラウザを識別する情報があり、ウェブサイトはその情報を検知できます。

Canvaが対応しているのは「GoogleChrome」「Firefox」「Safari」「Edge」のみで、それ以外のブラウザは弾かれてしまいます。

UserAgent調べる君で私が使用しているVivaldiを調べると…。

「Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.183 Safari/537.36 Vivaldi/1.96.1147.36」

と表示されています。VivaldiはChrome拡張機能が使えるようにChrome系のブラウザなのですが、独自ブラウザと認識して弾かれているようです。

Canva側がUserAgentに対応しなければ使えないまま

先程の公式フォーラムを見る限り、この問題はCanva側が対策しなければどうにもならないようです。

とはいえ、Canva側もセキュリティだったり実行テストなどのリスクが増えるので、対応してくれる可能性は低いでしょう。

なので、今回はChrome拡張機能でUserAgentを偽装します。

Chrome拡張機能でUserAgentを変更する

今回使用するのはUser-Agent Switcher for Chromeです。

UserAgentを偽装できるものならなんでも良いのですが、User-Agent Switcher for Chromeは特定のURLのみ偽装するよう設定できます。

Canvaの使用時にいちいち切り替える必要がないのがオススメポイントです。

User-Agent Switcher for Chromeの設定方法

Chrome公式ウェブストアからUser-Agent Switcher for Chromeをインストールしたら、拡張機能アイコンが表示されます。

これをクリックすると偽装するUserAgentを選べるのですが、いちいちCanvaを開く時だけ選択して、戻して…という作業は面倒なので「Canvaを開くときだけUserAgentを偽装する」設定を行いましょう。

アイコンを右クリックしてオプションを選択

設定画面の左メニューからPermanent Spoof Listを選択

Permanent Spoof Listでドメインを指定

「Domain」の欄に記入するのはCanvaのアドレス「www.canva.com」です（https://を除く）

偽装するUserAgentはCanvaが対応しているブラウザならなんでも良いのですが「Firefox」を選択するのが無難です。

設定が終わったら「Add」を選んで保存してくださいね！

追加されれば設定完了！

このように、Canvaのドメインで使用するUserAgentをFirefoxに指定しておけば、面倒な切り替えをすることなく…

VivaldiでCanvaが使える！

もし今後の更新で上記の方法がダメだった場合は最新のChromeに偽装する方法もありますので、下記をご覧ください。

VivaldiのUserAgentをGoogle Chromeに偽装する

Chrome拡張機能なので当然ですが、デフォルトではGoogleChromeのUserAgentに偽装することはできません。

だって、Vivaldiで使うのでなければ偽装前はGoogleChromeですからね（笑）

VivaldiでGoogleChromeのUserAgentに偽装する設定方法を解説しますので、覚えておけば他のサイトでエラーが出たときに役立つかも？

User-Agent Switcher for Chromeのオプションを開いて「Custom User-Agent List」からGoogleChromeのUserAgentを追加します。

GoogleChromeでUserAgent調べる君を開けばお使いのGoogleChromeのUserAgentが分かりますが、私の環境で最新のUserAgentは以下の通りです。

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100

これをコピペして頂いければ問題ないかと思います。

1. New User-agent name｜管理名です。わかりやすいものを記入します
2. New User-Agent String｜偽装するUserAgentです。上記のコードをコピペするか、調べて記入してください。
3. Group｜UserAgentを記入すれば自動で割り振られると思いますが「Chrome」にしてください。
4. Append?｜デフォルトの「Replace」で大丈夫です。
5. Indicator Flag｜UserAgent偽装中に拡張機能アイコンに表示する文字列です。お好みでどうぞ（3文字まで）

以上を設定し「Add」で保存します。

このように追加されます

追加が完了すれば拡張機能アイコンをクリック→Chromeで追加したUserAgentを選択できるようになります。

Defaultの下に追加される

まとめ

VivaldiでCanvaを使う方法は以上です。

拡張機能「User-Agent Switcher for Chrome」は頻繁に使うものではないと思うので、この記事で紹介したCanvaを開いた時だけUserAgentを偽装する設定を終えたら「ボタンを隠す」でアイコンを消しても良いかもしれませんね。

Vivaldiは本当にオススメなブラウザなので、多少の不具合なら自分で対処してでも使い続けたいですね。（今回の不具合はCanvaの仕様のせいですが…）