Announcements

Help Wizard

Step 1

NEXT STEP

Spotify Play Button 502 Bad Gateway Error - ALL THE TIME!

Spotify Play Button 502 Bad Gateway Error - ALL THE TIME!

Avatar of KieronBotting
Regular
2014-03-04 12:57 PM

Hi Folks,

 

Wonder if you can help me with the following issue...

 

I have a webpage in development here:

http://dubjam.co.uk/website/

 

There is a boombox graphic that is supposed to hold the Spotify Play Button, but after following the instructions for embedding this widget, I receive a 502 Bad Gateway error, and this has not changed since trying to add this item to my page.

 

What's weirder is that when I test the page live, I see another copy of the Googlemap that I already have in that page, brought into the DIV that I have set-up for the Spotify playlist. Just to confirm, the Googlemap DIV is called 'map', and the Spotify DIV is called 'spotify'. The Spotify DIV only contains the Spotify iFrame code that i obtained from here:

 

https://developer.spotify.com/technologies/widgets/spotify-play-button/#generator

 

I have followed the insructions to obtain my URI, but alas I get the 502 error everytime.

 

Any ideas?

 

Many thanks in advance.

Labels:
0 Likes
Reply
29 Replies

Avatar of Peter__
Community Legend
2014-03-04 01:36 PM
Could you post your embed code you are using here?

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of KieronBotting
Regular
2014-03-04 02:24 PM

No problem, I tried the following:

 

<iframe src="https://embed.spotify.com/?uri=spotify:user:dubjamcg:playlist:3OlbjhEyJSwxd4RnEatO5j" width="250" height="80" frameborder="0" allowtransparency="true"></iframe>

 

Hope that helps.

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 04:29 PM

Test:

 

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of Merik
Community Legend
2014-03-04 04:30 PM

Your website seems to be working just fine for me!

 

If your case is resolved, please click the 'Accept as Solution' button and add your kudos!

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 04:31 PM

Definitely something not right here, let me get this reported to the Spotify guys for you. 

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of KieronBotting
Regular
2014-03-04 04:33 PM

Sorry Peter, but I can not see anything in your test post. What am I supposed to see?

0 Likes

Avatar of KieronBotting
Regular
2014-03-04 04:34 PM

Thanks Peter. Much appreciated.

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 04:34 PM
I was testing the embed code (since I have HTML permissions on the community). The playlist *should* appear there. 😛

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of KieronBotting
Regular
2014-03-04 04:36 PM

Hi Merik,

 

Thanks for your kind words, but you'll see from my screengrab that the player does not appear for me, which has been tried in 4 browsers.

Screen Shot 2014-03-04 at 15.33.08.png
0 Likes

Avatar of KieronBotting
Regular
2014-03-04 04:39 PM

Hi Peter,

 

Perhaps there is something obvious that I am missing. feel free to check the code of my page to see if you can spot anything.

 

I tried the regular html embed as well, but that failed too. I made sure my playlist was set to public, but I'm new to this side of things, so I may not be doing something that I need to.

 

Look forward to your next update.

0 Likes

Avatar of Merik
Community Legend
2014-03-04 04:42 PM

Here is a cleanup of your code, see if it works.

 

Spoiler
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
<link href='http://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css' />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="DUB JAM - Jerk BBQ &amp; Rum Shack. Sign-up for a taste of reggae!" />
<meta name="keywords" content="Dub Jam,dubjam,jerk,bbq,rum,shack,reggae,rum,punch,jamaican,skewers,burgers,reggae,covent garden,london,WC2E" />
<title>DUB JAM - Jerk BBQ &amp; Rum Shack - Covent Garden, London WC2E 9HP - DubJam</title>
<!--[if !IE 7]>
        <style type="text/css">
                #wrap {display:table;height:100%}
        </style>
<![endif]-->
<link href="styles/sticky.css" rel="stylesheet" type="text/css" />
<link href="styles/styles.css" rel="stylesheet" type="text/css" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<script type="text/javascript">
//<![CDATA[
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.osrc=x.src; x.src=a[i+2];}
}
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-47700214-1', 'dubjam.co.uk');
  ga('send', 'pageview');

//]]>
</script>
<style type="text/css">
/*<![CDATA[*/
 iframe.c2 {border:0}
 iframe.c1 {border:none; overflow:hidden; width:385px; height: 385px}
/*]]>*/
</style>
</head>
<body onload="MM_preloadImages('img/dubjam-facebook.jpg','img/dubjam-instagram.jpg','img/dubjam-twitter.jpg','img/mystery-link.png','img/dubjam-menu-download.png')">
<div class="wrapper">
<div class="header"></div>
<!-- end header -->
<div class="mainContent">
<div id="menu"><span class="bbqPink">Chill out or take out</span><br />
<span class="bbqRed">Jamaican jerk skewers,</span><br />
<span class="bbqGreen">Beach burgers &amp;</span><br />
<span class="bbqYellow">Reggae Rum Punch.</span><br />
<span class="bbqBlue">IRIE!!</span></div>
<!-- end menu -->
<div id="menuDownload"><a href="Dub_Jam_Online_Menu.pdf" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu','','img/dubjam-menu-download.png',1)"><img src="img/dubjam-menu-download.png" alt="dub jam menu" name="menu" width="98" height="175" border="0" id="menu2" /></a></div>
<!-- end menuDownload -->
<div id="instagramSlideshow"><iframe src="http://www.intagme.com/in/?u=ZHViamFtYmJxfHNsfDM4MHwyfDN8fG5vfDV8dW5kZWZpbmVk" frameborder="0" scrolling="no" class="c1"></iframe></div>
<div id="address">DUB JAM<br />
20 Bedford Street,<br />
Covent Garden<br />
London, WC2E 9HP</div>
<div id="hours">Tel: 0207 836 5876<br />
Open: Monday - Saturday<br />
        7am - Midnight<br />
Sunday: 7am - 10.30pm</div>
<div id="intro">CHECK OUT OUR<br />
TROJAN SELECTION!</div>
<!-- end intro -->
<div id="spotify"><iframe src="https://embed.spotify.com/?uri=spotify:user:dubjamcg:playlist:3OlbjhEyJSwxd4RnEatO5j" width="250" height="80" frameborder="0"></iframe></div>
<div id="social">Like? Follow? Tweet?</div>
<!-- end social -->
<div id="welcome">
<h1>Welcome to<br />
Dub Jam<br />
Jerk <span class="bbqGreen">B</span><span class="bbqPink">B</span><span class="bbqCyan">Q</span><br />
+ <span class="bbqRed">R</span><span class="bbqYellow">u</span><span class="bbqBlue">m</span> Shack</h1>
<h2>CaribBean restaurant in Covent Garden</h2>
</div>
<!-- end address -->
<div id="emailContact">FOR SOME<br />
REGGAE LOVE!</div>
<!-- end mailingIntro -->
<div id="map"><iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2483.1240945349077!2d-0.12481529999999218!3d51... width="436" height="250" frameborder="0" class="c2"></iframe></div>
<div id="mailingIntro">Reach out - <a href="mailto:irie@dubjam.co.uk">irie@dubjam.co.uk</a></div>
<!-- end mailingIntro -->
<div id="pressEmail"><a href="mailto:press@dubjam.co.uk">press@dubjam.co.uk</a></div>
<!-- end pressEmail -->
<div id="signUp">
<div id="signUpForm">
<form action="http://mysteryltd.createsend.com/t/d/s/okuju/" method="post"><input id="fieldEmail" name="cm-okuju-okuju" type="email" onfocus="this.value='';" value="Please enter your email here &amp; click submit" /> <button type="submit" class="signUpButton" name="submit">SUBMIT</button></form>
</div>
</div>
<!-- end signUp -->
<div id="facebook"><a href="https://www.facebook.com/dubjambbq" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('facebook','','img/dubjam-facebook.jpg',1)"><img src="img/dubjam-facebook.jpg" alt="facebook" name="facebook" width="67" height="67" border="0" id="facebook2" /></a></div>
<!-- end facebook -->
<div id="instagram"><a href="http://instagram.com/dubjambbq" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('instagram','','img/dubjam-instagram.jpg',1)"><img src="img/dubjam-instagram.jpg" alt="instagram" name="instagram" width="67" height="67" border="0" id="instagram2" /></a></div>
<!-- end instagram -->
<div id="twitter"><a href="https://twitter.com/dubjambbq" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('twitter','','img/dubjam-twitter.jpg',1)"><img src="img/dubjam-twitter.jpg" alt="twitter" name="twitter" width="67" height="67" border="0" id="twitter2" /></a></div>
<!-- end twitter -->
<div id="mysteryLink"><a href="http://www.mystery.co.uk/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('mystery','','img/mystery-link.png',1)"><img src="img/mystery-link.png" alt="design by mystery" name="mystery" width="180" height="23" border="0" class="paddingLeft" id="mystery" /></a></div>
</div>
<!-- end mainContent-->
<div class="push"></div>
<!-- end push --></div>
<!-- end wrapper -->
</body>
</html>

 

If your case is resolved, please click the 'Accept as Solution' button and add your kudos!

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 04:43 PM
It actually looks like a fault on embed.spotify.com rather than on your site from where I am sitting since I can't load the embed player for that playlist.

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of Merik
Community Legend
2014-03-04 04:49 PM

Everything is working just fine for me.

Google Chrome Version 34.0.1847.11 beta

Safari Version 7.0.2 (9537.74.9)

 

Screen Shot 2014-03-04 at 8.46.35 AM.png

If your case is resolved, please click the 'Accept as Solution' button and add your kudos!

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 04:52 PM
Weird I get nothing on Firefox or Chrome. Can you see the playlist in my test post on the previous page?

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of Merik
Community Legend
2014-03-04 04:56 PM
@Peter wrote:
Weird I get nothing on Firefox or Chrome. Can you see the playlist in my test post on the previous page?

Yes sir! 🙂

 

It may just a client-side error. You may have to reinstall Flash Player, Java, and/or Spotify.

If your case is resolved, please click the 'Accept as Solution' button and add your kudos!

0 Likes

Avatar of Peter__
Community Legend
2014-03-04 05:11 PM

Don't think that will help, since flash in firefox and chrome are different versions and as far as I am aware there is no dependence on Java + interestingly the playlist opens fine in my client. 

 

And other embeds work fine:

 

 

Not sure what is going on!

Peter
Spotify Community Mentor and Troubleshooter

Spotify Last.FM Twitter LinkedIn Meet Peter Rock Star Jam 2014


If this post was helpful, please add kudos below!

0 Likes

Avatar of KieronBotting
Regular
2014-03-04 05:31 PM

Yup, I see that embedded list.

 

The plot thickens...

0 Likes

Avatar of KieronBotting
Regular
2014-03-05 10:58 AM

Hi - Just wondered if there was any update on this?

0 Likes

Avatar of Robbie
Spotify Legend
2014-03-05 11:44 AM
Hey there! We've been looking into this for you.

It's likely the size of the playlist as there are a lot of tracks. Could you please try cutting it down to 200 or less tracks and see if that's any better?

Only the first 200 tracks will be shown on all play button embeds (under Playlist restriction): https://developer.spotify.com/technologies/widgets/spotify-play-button/

Hope this helps out. Let us know how you get on!
—

Check out how we're doing: @SpotifyStatus

Did this help? Please click 'Accept as Solution'.
0 Likes

Suggested posts

Let's introduce ourselves!

Hey there you,   Yeah, you! 😁   Welcome - we're glad you joined the Spotify Community!   While you here, let's have a fun game and get…

Staff
ModeratorStaff / Moderator/ 2 years ago in Social & Random
Read more