先に設定内容を書きます！
検索してきて、答えはどこやねんイライラってすることありますよね？
それが嫌いなので、先に答え。
作成したファイルは２つ、
.htaccessとindex.html
.htaccess
リダイレクトするための設定を入れました
RewriteCond %{http_host} ^test.com
RewriteRule ^(.*) https://shop.test.jp//$1 [R=301,L]
index.html
リダイレクトしてくれない場合があったので、index.htmlをウェブルートに配置して、表示したらすぐにjqueryで遷移するように設定しました。
自動で遷移しない場合を考慮して、手動でもリンク踏んで遷移するように設定を加えました。
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>
test.com
</title>
<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
<script>
$(window).load(function() {
setTimeout(function(){
window.location.href = 'https://shop.test.jp';
}, 10);
});
</script>
</head>
<body>
<div class="parent”">
<p>画面が表示されない方は、<a href="https://shop.test.jp">こちらをクリック</a>してください。</p>
<p><a href="https://shop.test.com">test.com</a></p>
</div>
</body>
</html>ブラウザによって遷移しなかったり、PCとスマホで挙動が違ったりと、答えがわかるまでいくつか試行錯誤しました。
やったことを一言で言うと。
MuuMuu Domain!とロリポップを連携して、遷移したいドメインをロリポップ！のWebサーバに向けて、Webサーバへのリクエストをベイスのサイトにリダイレクトした、ってことになります。
以下、どうしてこうなったかを切々と。
状況
友人に頼まれてWebショップを作るお手伝い。売上の見通しが立っていないため、先ずは無料のbaseを使って構築することに。
baseは数年前に知り合いのショップを作るのにも活用したことがあるので基本的な使い方はばっちり。
といってもそんなに難しいことは何もないので、リテラシーが多少あれば問題ないはず。
かつてbaseはデザインのテンプレートが少なくてイマイチだと思っていたのですが、だいぶん進化していた。
テンプレートをベースに、デザインツールからパーツを選択して色々と設定することができるようになって捗ります。
いい感じである程度の希望のデザインを落とし込むことに成功しました。
ちなみにドメインはMuuMuu Domain!で先方が取得済み。
ムームーメールというのも契約してメールサーバをムームードメイン側のものを使用する設定をしていました。
Webサーバ借りてそっちに作った方が良かったのですが、すでに借りた後だったのでその時は特に突っ込むことなく終了。
しかし、あとあと結局はムームーメールは使わないことになりました。
ムームードメインは転送機能がない
以下の2点が問題になってちょっと手間取ったわけです。
１．ムームードメインにはURL転送機能はない
２．ベイスはサブドメインしか設定できない
そのため、対応するにはWebサーバが必要で、急遽MuuMuu Domain!と相性の良いロリポップ！の一番安いやつを借りて、対応したってわけです。
作業の流れ
最終的に必要な工程は以下です。
こう書くと大変そうだけど、１時間もかからないと思います！（はまらなければ！）
サブドメインをbaseに追加しようとしている人は大丈夫です。
www.bug.com
とか
shop.bug.com
の人は大丈夫です。
ダメなのはこういう人
bug.com
だとか
bug.jp
でベイスを表示させたい場合。
作業の流れ
１．ドメインを借りる（MuuMuu Domain!）
２．サーバを借りる（ロリポップ！）
リダイレクトするだけのサーバなのでプランは一番安いプランで大丈夫です。
ラッキーなことに初期費用無料キャンペーン中でした。
月額100円。
３．リダイレクト用の設定「.htaccess」をロリポップのサーバに配置
４．一部リダイレクトしないブラウザがあったので、htmlからjqueryで強制リダイレクト＆手動でも遷移できるようにHTMLを作成し、.htaccessと同じディレクトリに配置
（ベイス側の設定は不要）
サブドメインでベイスに遷移させたい人はこちら
baseのヘルプが親切で分かりやすいのでこちらを参照ください
まとめ
ベイスに独自ドメイン設定したい場合、方法としてはベイスのAppをインストールして、ドメイン側にCNAMEレコードを追加して、って方法ばかり出てきます。
でもベイスにはサブドメインしかダメな制約があるので、そこがポイントでした。
ベイスは無料のドメインでそのまま使えるのですが、サービスを作りたい時には独自ドメインで紐付けしてやる方が良いことがあります。
そんな時にこんな感じで小手先の技術で対応できると安心ですね。
