0

Я просто добавил плагин Facebook Like/Send на свою страницу. Я QA'd плагин на моей машине dev, и все работает отлично. Когда я опубликовал сайт на своем веб-сайте (http://www.raveradar.com), кнопка «Отправить» начала иметь проблемы.Кнопка отправки Facebook - кнопка отмены не работает

Проблема только при нажатии кнопки «Отправить», когда вы нажимаете «Отправить», открывается новая форма, но, как ни странно, кнопка «Отмена» в этой форме больше не работает. То есть, когда нажата кнопка «Отмена», выпадающая форма не исчезает. Нет ошибок, ничего. Все, что я могу понять, это то, что это какая-то проблема с CSS, но меня смущает то, что это работало на localhost во всех браузерах. Если бы это была проблема CSS, я бы не испытал ее?

Любая помощь очень ценится.

HTML тег:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#"> 

тела:

<body onload="LoadRaveRadarMap('<%=ConfigurationManager.AppSettings["bingMapsKey"].ToString() %>');"> 

<!-- Setup Facebook JavaScript SDK --> 
<div id="fb-root"></div> 
<script> 
    window.fbAsyncInit = function() { 
     FB.init({ 
      appId: '<%=ConfigurationManager.AppSettings["raveRadarAppID"].ToString() %>', 
      channelUrl: '//ConfigurationManager.AppSettings["raveRadarDomain"].ToString() %>/scripts/channel.html', 
      status: true, 
      cookie: true, 
      xfbml: true 
     }); 
    }; 

    // Load the SDK Asynchronously 
    (function (d) { 
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) { return; } 
     js = d.createElement('script'); js.id = id; js.async = true; 
     js.src = "//connect.facebook.net/en_US/all.js"; 
     d.getElementsByTagName('head')[0].appendChild(js); 
    } (document)); 
</script> 

<form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
     <Services> 
      <asp:servicereference Path="WcfRaveRadar.svc" /> 
     </Services> 
    </asp:ScriptManager> 

    <div id="container"> 
     <!-- Rave Radar Map - The source of all awesomeness! --> 
     <div id="raveMapContainer" class="raveMap" /> 

     <!-- Facebook 'Like' button --> 
     <div id="fbLike"> 
      <fb:like ref="top_left" href="<%=ConfigurationManager.AppSettings["raveRadarDomain"].ToString() %>" send="true" layout="button_count" width="129" show_faces="true" font="arial"></fb:like> 
     </div> 
    </div> 
</form> 

Страница CSS (raveRadar.css):

.raveMap { 
position: absolute; 
top: 0px; 
left: 0px; 
width: 100%; 
height: 100%; 

}

#fbLike { 
position: absolute; 
top: 35px; 
z-index: 1002; 
width: 129px; 

}

EDIT: После проверки консоли Chrome, я могу видеть, что ошибка IS, появляющейся при нажатии кнопки "Отмена":

Unsafe JavaScript attempt to access frame with URL http://www.facebook.com/dialog/oauth?api_key=288300704552515&app_id=288300704552515&channel_url=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df148fbcbb4%26origin%3Dhttp%253A%252F%252Flocalhost%253A50280%252Ff14432130c%26relation%3Dparent.parent%26transport%3Dpostmessage&client_id=288300704552515&display=none&domain=localhost&locale=en_US&origin=1&redirect_uri=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df1d2b95ec4%26origin%3Dhttp%253A%252F%252Flocalhost%253A50280%252Ff14432130c%26relation%3Dparent%26transport%3Dpostmessage%26frame%3Df3797f333c&response_type=token%2Csigned_request%2Ccode&sdk=joey from frame with URL http://www.facebook.com/plugins/send_button_form_shell.php?api_key=288300704552515&channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df8557776c%26origin%3Dhttp%253A%252F%252Flocalhost%253A50280%252Ff14432130c%26relation%3Dparent.parent%26transport%3Dpostmessage&controllerID=ut2r33_4&error=&extended_social_context=false&locale=en_US&nodeRef=top_left&nodeURL=http%3A%2F%2Fwww.raveradar.com%2F&sdk=joey. Domains, protocols and ports must match. 

Я m получая эту ошибку на моей машине dev, и на моем веб-сайте. Я просто не понимаю, почему он работает на моем локальном хосте, но не на моем сервере. Есть ли обходные пути?

+0

Что такое HTML, отправляемый в браузер? – DMCS

+0

Я не понимаю, не могли бы вы уточнить? –

+0

Пожалуйста, также опубликуйте ИСТОЧНИК ПРОСМОТРА того, что видит веб-браузер. Все, что я вижу в вашем вопросе выше, - это серверный код. – DMCS

ответ

1

Элемент ошибки в консоли хром является «нормальным» и не связан с вашей проблемой. Я тоже это вижу, но доля по-прежнему работает.

Я протестировал ваш сайт как с FF, так и с Chrome, и кнопка отправки работает нормально, независимо от того, вошла ли я в систему. Обе кнопки отправки и отмены работают на вылете.

Я нарисовал URL-адрес, который вам понравился, и он правит правильно (обычно это источник большинства проблем людей).

Мне интересно, связано ли это с вашим конкретным браузером. Возможно, на вашем ящике есть запись файла хоста, указывающая ресурсы в другом месте.

+0

Хорошо, я проверю его с другого места завтра, чтобы узнать, что случилось. На моей машине dev я тестировал с Chrome, IE, Opera, FF и Safari с теми же результатами. Надеюсь, что это так просто, как запись хоста. Спасибо за помощь :) –

+0

Не уверен, что случилось с моей машиной dev, но похоже, что она корректно отображается на других компьютерах. Благодарю. –

0

Недавно я столкнулся с идентичной проблемой, как Andrew Craswell, но, к сожалению, для меня тестирование на другой машине не дало других результатов; кнопка «Отмена» по-прежнему не функционирует, и «Share modal» не может быть уволен.

После некоторых охоты вокруг & работает до минимальных тестов, я узнал, что мой вопрос CSS связаны, мы делаем это в нашем глобальном файле CSS:

.fb_iframe_widget { display: block !important; } 

Удаление этой линии исправили проблему полностью ,Стоит отметить, что это произошло и в браузерах Webkit &, не являющихся веб-сайтами.

Надеюсь, это поможет любому, кто может столкнуться с этой проблемой.

Смежные вопросы