モバイルページへの転送について

[bronco]

現在はjavascriptを下記の様に設定してスマホページに飛ばしていますが、
特定のページにしか飛ばせないため困っております。

// iPhoneまたは、Androidの場合は振り分けを判断
if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
if(confirm('スマホサイトを表示します。よろしいですか？')) {
location.href = 'http://ドメイン名/sumaho.php';
}
}


javascriptで同一のエントリーのページに飛ばす方法はありますでしょうか。
ご教示いただければ幸いです。

pc用ページ
http://ドメイン/review.php?eid=00002

↓　こちらのページへ移動

スマホ用ページ
http://ドメイン/review_sumaho.php?eid=00002

[webmaster]

broncoさん、コメントありがとうございます。webmasterです。
とても高度な応用事例で、積極的にご活用いただいていることに感謝致します。

ひとつの方法として、Javascriptを使って現在のURLからエントリIDを抽出し、その値を元にジャンプ先のURLを作る、という方法があるかと思います。
たとえば次のようなJavascriptで、URLからエントリIDを割り出せます（URLが常にエントリIDで終わることが保証されている場合に限ります）。

コード: 全て選択

var eid = location.href.split("=").pop();

内容としては、location.hrefで現在のURLを取得し、そのURLを「=」という文字で区切った結果を配列にし（split）、その末尾を取得する（pop）というものです。

URLに他のパラメータがつく可能性がある場合には、

コード: 全て選択

var eid = location.href.split('?eid=').pop().slice(0,5);

のほうがより厳密にエントリIDを抽出できるかと思います。（「?eid=」という文字で区切って、右側の文字列から先頭5文字を抜き出しています）

あとはこのeidを、

コード: 全て選択

location.href = 'http://ドメイン/review_sumaho.php?eid=' + eid;

のようにして、ジャンプ先のURLに指定すればうまくいくと思います。
ただ、URLというのは利用者側でいかようにも改ざんできたりする為、あまりそれを信用してジャンプ先を作るというのは、セキュリティ上の懸念材料になるかと思います。

もしその点がご心配であれば、CMS Designer側でJavascriptを生成するという方法が使えるかと思います。

CMS Designerのデザイン定義からは、<xsl:value-of select="@id" />というタグで現在のエントリIDを取得できますので、

コード: 全て選択

<script>
// iPhoneまたは、Androidの場合は振り分けを判断
if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
if(confirm('スマホサイトを表示します。よろしいですか？')) {
location.href = 'review_sumaho.php?eid=' + '<xsl:value-of select="@id" />';
}
}
</script>

みたいな感じでいけると思いますが、上記のままデザイン定義に記述してしまうと、「&」や「>」などがタグや特殊文字として認識されてしまうので、エラーになると思います。
それを避けるにはそれらの文字をいちいち全部エスケープ記述せねばならず、メンテナンスしづらくなると思います。基本的にXSL内に直接Javascriptをたくさん書くのは避けたほうが無難です。

そこで、この振り分け用のJavascriptをまず関数として定義しなおし、それをデザイン定義側で呼び出すようにしてみることをご提案します。

まず、以下の関数を、HTML側の現在のJavascriptと置き換えます。

コード: 全て選択

function checksmartphone( eid )
{
  // iPhoneまたは、Androidの場合は振り分けを判断
  if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
    if(confirm('スマホサイトを表示します。よろしいですか？')) {
      location.href = 'http://ドメイン名/review_sumaho.php?eid=' + eid;
    }
  }
}

これで、checksmartphone( '00012' ); などと記述すれば、スマホチェックの後、指定したページへエントリID付でジャンプできるようになります。

これをデザイン定義側で呼び出すようにします。

コード: 全て選択

<script>
  checksmartphone('<xsl:value-of select="@id" />');
</script>

Javascriptもシンプルなので特にエスケープ処理なども不要で、メンテもし易くなるかと思います。

この内容は、broncoさんがある程度Javascriptに堪能であることを前提にしている為、もしそうではない場合、いろいろとよくわからない点が多いと思います。
ご不明な点、もしくは「これではうまくいかない」などのお話がございましたら、大変お手数ですが再度ご連絡頂ければ幸いです。

[bronco]

webmaster様

早速のご返信、またご丁寧な回答に感謝いたします。
有難う御座いました。

早速、ご回答のとおりにjavascriptの作成→phpにて.js＋関数の読み込みを試しましたが、
飛び先のurlがうまく読み込めませんでした。
（ここまでで間違ってますでしょうか）

ダイアログボックスが「'スマホサイトを表示します。よろしいですか？'」の「’＿’」内が文字化けておりました。
あと、飛び先が下記のとおりeid以下が文字化け？ていました。
http://ドメイン名/review_sumaho.php?eid=長い文字の羅列

おそらくこの説明だけでは分からないかと思います。
的を射ていない質問で申し訳御座いません。

今までネットで調べ、知識は無いものの自分で検証を繰り返した結果、どうしようもなく質問させていただきましたが、
どうもうまくいきませんでした。
ただこれだけヒントをいただいたのですからご回答を読み返し、少し自分で調べてみたいと思います。
本当に有難う御座いました。

一点だけ確認させてください。
ご回答に
function checksmartphone( eid )
{
// iPhoneまたは、Androidの場合は振り分けを判断
if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
if(confirm('スマホサイトを表示します。よろしいですか？')) {
location.href = 'http://ドメイン名/review_sumaho.php?eid=' + eid;
}
}

とありましたが、
最後にもう一つ" ｝"(閉じカッコ）は必要でしょうか。
申し訳ありませんがご回答いただけると幸いです。

あとcmsdesignerの有料のサポートというのは御座いますでしょうか。
勝手申し上げますがよろしくお願いいたします。

[webmaster]

broncoさん、未解決とのことで、お手数をおかけしております・・・。
また、ご指摘の通り、checksmartphone関数は、最後に中括弧が抜けておりました。m(__)m

今後のために、以前の投稿分を修正しておきます。

有料サポートは実施しておりませんが、もう少し具体的に書いてみますので、いったん修正した箇所を全て元に戻した上で再度お試し頂ければと思います。

まず、現状、以下のようになっている個所があるかと思います。これは、PC向けの各ページ（.php）の先頭部分に貼ってあるのだと推測しております。

コード: 全て選択

  // iPhoneまたは、Androidの場合は振り分けを判断
  if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
    if(confirm('スマホサイトを表示します。よろしいですか？')) {
      location.href = 'http://ドメイン名/sumaho.php';
    }
  }

この部分を消して、代わりに以下のコードに置き換えます（ジャンプ先のURLの部分は、適当に今回必要なジャンプ先のURLに変えてください）。

コード: 全て選択

function checksmartphone( eid )
{
  // iPhoneまたは、Androidの場合は振り分けを判断
  if (document.referrer.indexOf('ドメイン名') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
    if(confirm('スマホサイトを表示します。よろしいですか？')) {
      location.href = 'http://ドメイン名/review_sumaho.php?eid=' + eid;
    }
  }
}

次に、このページのCMSD埋め込みタグで使用しているデザイン定義があると思いますので、それを編集して、以下のようなscriptタグ（3行分）を追加します。

コード: 全て選択

<xsl:template match="entry">
  <script>
    checksmartphone('<xsl:value-of select="@id" />');
  </script>
  ※以下、既存のデザイン定義が続く

これで完了です。

この部分が出力するHTMLコードは、例えば、

<script>
checksmartphone('00012');
</script>

のようになり、checksmartphone関数が呼び出されます。
checksmartphone関数では、アクセス元がスマホかどうかを調べて、スマホならそのサイトへジャンプします。その際に、URLにeid=エントリIDをつけますので、対応するページへジャンプすることができるようになります。

以上のような流れとなります。
もしうまくいかない場合、もし可能でしたら、関連するソースファイルなどを添えて、cms(アットマーク)al-design.jpまでお送り頂ければ、もう少し詳しくアドバイス等が可能かもしれません。何度もお手数をおかけしますが、よろしくお願いいたします。

[bronco]

webmaster様

素晴らしいです！
記述いただいたとおりに書き換えましたら機能しました。
情報が少ない中でここまで的確にご回答いただきましたことに感謝の言葉もありません。
深く感謝しております。

[webmaster]

broncoさん、結果報告ありがとうございます。

うまく動作したとのことで、安堵しております。また何かございましたら、何でも結構ですのでご連絡頂ければ幸いです。