tencent cloud

フィードバック

PicGo+Typora+COSでの画像ホスティングサービスの構築

最終更新日:2023-03-14 14:16:42

    概要

    画像ホスティングサービスは、画像ストレージ、画像加工処理、画像のネットワーク全体への配信などの機能を提供します。世界中に無数にあるブログウェブサイトおよびコミュニティフォーラムに対し、バックエンドでの画像サービスのサポートを提供します。開発者は、Tencent CloudのCloud Object Storage(COS)を使用し、画像ホスティングサービスを構築することができます。COSは、Tencent Cloudが提供する大量のファイルをストレージする分散型ストレージサービスです。これまでよりもさらに豊富な機能、優れた性能、信頼性の高い保障を提供します。

    COSを画像ホスティングシーンに用いるメリットは、以下のとおりです。

    • 低コスト:ストレージ単価が低く、従量課金のため、使用した分のみのご請求となります。
    • 速度制限無し:アップロード、ダウンロードに速度制限がないため、長い時間をかけてloadingを待つ必要がありません。アクセス品質もさらに良くなりました。
    • 高可用性:高レベルのSLA可用性保障を有しています。ストレージのデータは99.9999999999%もの耐久性を保障します。
    • 容量無制限:ファイル分散型ストレージで、大量のファイルをサポートします。必要に応じた容量を使用します。

    実践シーン

    シーン1:画像追加の際にCOSを使用し、画像ホスティングサービスを構築する

    このシーンで使用するのは、以下のツールです。

    • PicGo:複数のクラウドストレージ設定、クイック画像リンク作成をサポートするツールです。
    • Typora:軽量級のMarkdownエディタです。複数の出力形式をサポートし、ローカルの画像をワンクリックで画像ホスティングへアップロードします。

    操作手順

    1. PicGoをインストールし、Tencent Cloud COSサービス関連のパラメータを設定します。
      説明:

      今回の実践で使用するのはPicGo 2.3.1バージョンです。その他のバージョンでは設定手順に若干の違いがあるため、適宜調整してください。

      PicGo公式サイト でPicGoをダウンロードしてからインストールし、画像ホスティングでTencent Cloud COSを見つけ、以下の関連パラメータ項目を入力します。
    • COSバージョン:COS v5を選択します。
    • Secretldの設定:開発者は所有するプロジェクト身分識別IDを、身分認証に用います。APIキー管理ページで作成し、取得することができます。
    • SecretKeyの設定:開発者は所有するプロジェクト身分キーを、APIキー管理ページで取得することができます。
    • Bucketの設定:バケットは、COSでデータをストレージするコンテナとして使用されます。バケットの詳細については、バケット概要ドキュメントをご参照ください。
    • AppIdの設定:開発者はCOSにアクセスする際に所有するユーザーの次元における唯一のリソース識別として、識別リソースを用います。APIキー管理ページで取得することができます。
    • ストレージリージョンの設定:バケットの所属リージョンの情報です。列挙値については、アベイラビリティリージョンドキュメントをご参照ください。例えばap-beijing、ap-hongkong、eu-frankfurtなどです。
    • ストレージパスの設定:画像をCOSバケットに格納する際のパスです。
    • カスタムドメイン名の設定:選択可能です。上方のストレージ容量にカスタムオリジンサーバードメイン名を設定する場合、入力が可能です。説明についてはカスタムオリジンサーバードメイン名の有効化をご参照ください。
    • URLサフィックスの設定:URLのサフィックスにCOSデータ処理パラメータを追加することで、画像の圧縮、トリミング、形式変換などの操作を行うことができます。関連の説明については画像処理をご参照ください。
    1. typoraを設定します(オプション)。

      説明:

      編集ニーズがMarkdownシーンではない場合は、このステップを無視してかまいません。前のステップでインストールしたPicGoのみを画像ホスティングツールとして使用します。

      設定ガイドは以下のとおりです。

    2. typora上の好みの設定の画像について、以下の設定を行います。

      • 画像挿入時にて、画像アップロードを選択します。
      • アップロードサービスの設定にて、**PicGo(app)**を選択し、先ほどインストールしたPicGo.exeの場所を設定します。
    3. typoraを再起動し、設定を有効化します。

    4. typoraエディタエリアに移動し、直接画像をドラッグあるいはペーストすれば、画像がアップロードされ、COSファイルのリンクに自動で置き換えることができます。(ペースト後に、自動でCOSのリンクに置き換わらない場合は、PicGoのserver設定が開いているかどうかをチェックしてください)。

    シーン2:元の画像ホスティングリポジトリの画像を迅速にTencent Cloud COSに移行する

    ある画像ホスティングサービスを例にすると、ローカル画像ホスティングフォルダを探すか、オンライン上から完全なフォルダをダウンロードして、フォルダ内のすべての画像をCOSバケットに保存することができます。最後にリンクドメイン名を統一して変換すれば、サイトを元に戻すことができます。

    操作手順

    ステップ1:画像ホスティングサービスの画像をダウンロードする

    元の画像ホスティングウェブサイトにログインし、これまでのアップロード済み画像フォルダをダウンロードします。

    ステップ2:COSバケットの作成およびリンク不正アクセス防止の設定

    1.Tencent Cloudアカウントの登録をし、アクセス権限がパブリック読み取り・プライベート書き込みのバケットを作成します。操作ガイドはバケットの作成をご参照ください。
    2.バケット作成後、バケットのリンク不正アクセス防止設定を開き、画像が不正使用されるのを防ぎます。操作ガイドはリンク不正アクセス防止の設定をご参照ください。

    ステップ3:アップロードフォルダをバケットに保存

    先ほど作成したバケットからアップロードフォルダをクリックし、先ほど準備した画像フォルダをCOSバケットにアップロードします。

    説明:

    画像数が多い場合は、COSBrowserクライアント を使用すれば、画像を迅速にアップロードできます。

    ステップ4:リンクドメイン名のグローバルな自動置き換え

    COSコンソールバケットの概要ページに、バケットデフォルトドメン名をコピーします(カスタムCDNアクセラレーションドメイン名のバインドでも可)。共通コードエディタを使用し、プロジェクトグローバル検索置き換えに対して失効したリンクプレフィックスをCOSバケットのデフォルトドメイン名にします。

    説明:

    デフォルトドメイン名については、リージョンとアクセスドメイン名をご参照ください。

    • vscode検索置き換え事例:

    • sublime text検索置き換え事例:

    お問い合わせ

    カスタマーサービスをご提供できるため、ぜひお気軽にお問い合わせくださいませ。

    テクニカルサポート

    さらにサポートが必要な場合は、サポートチケットを送信して弊社サポートチームにお問い合わせください。24時間365日のサポートをご提供します。

    電話サポート(24 時間365日対応)