<p data-line="1" class="code-line">今まではお名前.comやAWSでドメインを購入していましたが、Cloudflareでデプロイすることが多くなり、ドメインもCloudflareで購入することにしました。</p>
<p data-line="3" class="code-line">購入方法を備忘録として残します。</p>
<h2 id="cloudflare-pages%E3%81%A7%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%82%92%E8%B3%BC%E5%85%A5%E3%81%99%E3%82%8B" data-line="5" class="code-line"><a class="header-anchor-link" href="#cloudflare-pages%E3%81%A7%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%82%92%E8%B3%BC%E5%85%A5%E3%81%99%E3%82%8B" aria-hidden="true"></a> Cloudflare Pagesでドメインを購入する</h2>
<ol data-line="7" class="code-line">
<li data-line="7" class="code-line">Cloudflareのダッシュボードの左側のメニューから「ドメイン登録」を選択します。</li>
</ol>
<p data-line="9" class="code-line"><a href="https://gyazo.com/3a476162a6ce324e151106d111ea2bc5" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/3a476162a6ce324e151106d111ea2bc5.png" alt="Image from Gyazo" /></a></p>
<ol start="2" data-line="11" class="code-line">
<li data-line="11" class="code-line">追加したいドメインを検索して、「確認」ボタンをクリックします。</li>
</ol>
<p data-line="13" class="code-line"><a href="https://gyazo.com/7617064b8ddc899c4984a12396e2eb40" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/7617064b8ddc899c4984a12396e2eb40.png" alt="Image from Gyazo" /></a></p>
<ol start="3" data-line="15" class="code-line">
<li data-line="15" class="code-line">登録を完了するページに遷移するので、支払い情報を入力して「購入完了」ボタンをクリックします。</li>
</ol>
<p data-line="17" class="code-line"><a href="https://gyazo.com/27f5fb9b580737a448e6ed809ed3e49a" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/27f5fb9b580737a448e6ed809ed3e49a.png" alt="Image from Gyazo" /></a></p>
<ol start="4" data-line="19" class="code-line">
<li data-line="19" class="code-line">購入が完了すると、下記のようなメッセージが表示されます。</li>
</ol>
<p data-line="21" class="code-line"><a href="https://gyazo.com/e60e7caa63f8acf286d3f06decddb4d2" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/e60e7caa63f8acf286d3f06decddb4d2.png" alt="Image from Gyazo" /></a></p>
<h3 id="%E3%82%A8%E3%83%A9%E3%83%BC%E3%81%8C%E7%99%BA%E7%94%9F%E3%81%97%E3%81%9F%E5%A0%B4%E5%90%88" data-line="23" class="code-line"><a class="header-anchor-link" href="#%E3%82%A8%E3%83%A9%E3%83%BC%E3%81%8C%E7%99%BA%E7%94%9F%E3%81%97%E3%81%9F%E5%A0%B4%E5%90%88" aria-hidden="true"></a> エラーが発生した場合</h3>
<p data-line="24" class="code-line">ドメイン購入時に下記のようなエラーが発生した場合の対処方法です。</p>
<aside class="msg message"><span class="msg-symbol">!</span><div class="msg-content"><p data-line="27" class="code-line">[申し訳ありませんが、問題が発生しました。]<br />
購入の詳細を確認してもう一度お試しください。詳細については、失敗した支払いのトラブルシューティングガイドをご覧ください。</p>
</div></aside>
<p data-line="31" class="code-line">実際には下記の画像のようなエラーが表示されます。</p>
<p data-line="33" class="code-line"><a href="https://gyazo.com/8a61d9761714bb5ed0ccf30aa71d21f2" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/8a61d9761714bb5ed0ccf30aa71d21f2.png" alt="申し訳ありませんが、問題が発生しました。" /></a></p>
<p data-line="35" class="code-line">調べてみると、楽天カードだとCloudflareの決済が失敗するらしいです。</p>
<p data-line="37" class="code-line">
    <iframe 
      class="hatenablogcard" 
      style="width:100%;height:155px;max-width:680px;" 
      src="https://hatenablog-parts.com/embed?url=https://blog.stin.ink/articles/sitn-ink-from-google-to-cloudflare" 
      width="300" 
      height="150" 
      frameborder="0" 
      scrolling="no">
    </iframe>       
    </p>
<p data-line="39" class="code-line">これ以外の可能性もありますが、一度他のクレジットカードで試してみると良いかもしれません。</p>
<p data-line="41" class="code-line">私の場合は、SMBCに切り替えたら購入することができました。</p>
<h2 id="%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%81%AE%E8%A8%AD%E5%AE%9A" data-line="43" class="code-line"><a class="header-anchor-link" href="#%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%81%AE%E8%A8%AD%E5%AE%9A" aria-hidden="true"></a> ドメインの設定</h2>
<p data-line="44" class="code-line">ドメインを購入したら、Pagesに登録して使えるように設定します。</p>
<ol data-line="46" class="code-line">
<li data-line="46" class="code-line">Cloudflareのダッシュボードから「Workers &amp; Pages」を選択し、購入したドメインを利用したいプロジェクトを選択します。</li>
</ol>
<p data-line="48" class="code-line"><a href="https://gyazo.com/af557828d14b4183624574168104108e" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/af557828d14b4183624574168104108e.png" alt="Image from Gyazo" /></a></p>
<ol start="2" data-line="50" class="code-line">
<li data-line="50" class="code-line">続いて「カスタムドメイン」タブを選択し、「カスタムドメインを設定」ボタンをクリックします。</li>
</ol>
<p data-line="52" class="code-line"><a href="https://gyazo.com/42d3fa0151a372fa7516326dd4d8df8e" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/42d3fa0151a372fa7516326dd4d8df8e.png" alt="Image from Gyazo" /></a></p>
<ol start="3" data-line="54" class="code-line">
<li data-line="54" class="code-line">ドメイン名を入力し、「続行」ボタンをクリックします。</li>
</ol>
<p data-line="56" class="code-line"><a href="https://gyazo.com/9482b546f0045163c6f0b32154c4e466" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/9482b546f0045163c6f0b32154c4e466.png" alt="Image from Gyazo" /></a></p>
<ol start="4" data-line="58" class="code-line">
<li data-line="58" class="code-line">設定を確認し、問題なければ「ドメインをアクティブにする」ボタンをクリックします。</li>
</ol>
<p data-line="60" class="code-line"><a href="https://gyazo.com/a66d78a39acf86515e7e8b59966c06f0" target="_blank" rel="nofollow noopener noreferrer"><img src="https://i.gyazo.com/a66d78a39acf86515e7e8b59966c06f0.png" alt="Image from Gyazo" /></a></p>
<p data-line="62" class="code-line">これでドメインの設定が完了しました。</p>
<p data-line="64" class="code-line">実際に使えるようになるまでには少し時間がかかるので、気長に待ちましょう。(最大48時間)</p>


Cloudflareでドメインを購入してPagesに登録する