ユーザーがいくつかの異なるソーシャルメディアネットワークを介してリンクを共有できるようにすることを検討しています。ツイート、ピン留め、LinkedInの共有ボタンはそれぞれ機能していますが、私たちが直面している問題はFacebookの送信ボタンを中心に展開しています。
ボタンは正常に読み込まれているように見えますが、クリックすると「www.website.com/page1.jsp?order_nbr=123456のページにアクセスできませんでした」というメッセージが表示されます。
Facebook Developersサイトでオブジェクトデバッガーを使用すると、何か面白いことが起こります。 www.website.com/page1.jsp?order_nbr=123456
スクレイプの応答コードをデバッグしようとすると、502エラーになります(URLが不正なHTTP応答コードを返しました)。デバッグしようとするとwww.website.com/page1.jsp
、200(通常の応答)が返されます。m.website.com/page1.jsp
またはをデバッグしようとするとm.website.com/page1.jsp?order_nbr=123456
、両方とも同じ502エラーを返します。
URLの後にパラメータがある場合に問題があるように見えますが、?
他に設定する必要があるものがあるのか、それともサーバー構成の問題である可能性があるのか疑問に思っています。
Facebookがページをスクレイプする方法、または上記の他のボタンが正常に動作しているときに送信ボタンで502エラーが発生する理由についての技術的な説明がある場合はどうでしょうか。任意の洞察をいただければ幸いです。
モバイルサイトでテストするために、私たちが物事を取り除いた最低限のコードは次のとおりです。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<head>
<title>Testing - Order #123456</title>
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/icon.png" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="viewport" content="width=device-width, user-scalable=yes" />
<meta name="format-detection" content="telephone=no" />
<link href="/css/test.css" rel="stylesheet" type="text/css" />
<meta property="og:title" content="Test - Order #123456" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://m.website.com/page1.jsp?order_nbr=123456"/>
<meta property="og:image" content="../../images/mobile_files/logo.png" />
<!--asynchronous loader-->
<script src="../../js/init.js" type="text/javascript"> </script>
</head>
<body>
<DIV id="fb-root"></DIV>
<DIV id="menu">
<DIV style="float: left; padding:2px; "><fb:send ref="top_left_m" ></fb:send></DIV>
<DIV style="float: left; padding:2px;"><a href="https://twitter.com/share" class="twitter-share-button" data-count="none">Tweet</a> </DIV>
<DIV style="float: left; padding:2px;"> <a data-pin-config="none" data-pin-do="buttonPin" href="//pinterest.com/pin/create/button/?url=http%3A%2F%2Fm.website.com%2Fjsp%2Forder.jsp%3Fjob_order_id%3D%3C%25%3DjobOrderId%25%3E&media=http%3A%2F%2Fm.website.com%2Fimages%2Fmobile_files%2Flogo.png&description=Testing..."><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /></a> </DIV>
<DIV style="float: left; padding:2px;"><script type="IN/Share"></script> </DIV>
<DIV style="clear:both;"></DIV>
</DIV>
</body>
</html>
更新:デバッガーの出力は先日とは異なります。再デプロイおよび/またはキャッシュされた(サーバーおよび/またはローカル)以前のテストが原因であると思いますが、2つの主要な問題が残っています。
。#1-メインサイトは正常にスクレイピングしています(リターンコード200)。モバイルサイトは502を返し、何も返しません。
。#2-Facebookにログインしていない場合は、サインインを求めるポップアップが表示されます。ログインすると、ウィンドウが完全に消えます。Facebookにログインすると、ポップアップが一時的に表示された後、完全に消えます。
。#3-URLのパラメータが問題として除外されました。
最大の問題(#2)の性質に基づいて...質問を次のように変更します...「Facebookの送信ボタンのポップアップウィンドウが閉じるのはなぜですか?」
(それがより適切である場合、私は#1を別の質問に分割しますが、私の問題全体は、すべてを1つの質問に残すことによって最もよく役立つと思います)
関連する場合に備えて、JS非同期ローダーは次のとおりです。
(function(doc, script) {
var js,
fjs = doc.getElementsByTagName(script)[0],
add = function(url, id) {
if (doc.getElementById(id)) {return;}
js = doc.createElement(script);
js.src = url;
id && (js.id = id);
fjs.parentNode.insertBefore(js, fjs);
};
// Facebook SDK
add('//connect.facebook.net/en_US/all.js#xfbml=1', 'facebook-jssdk');
// Pinterest
add('http://assets.pinterest.com/js/pinit.js');
// Twitter SDK
add('//platform.twitter.com/widgets.js', 'twitter-wjs');
// LinkedIN
add('//platform.linkedin.com/in.js');
}(document, 'script'));