guillaumew
guillaumew

Reputation: 197

Spotify Apps and jQuery

How can I add and use jQuery in my Spotify App (using Spotify Apps API)?

Regarding this this article http://docs.jquery.com/Using_jQuery_with_Other_Libraries I tried this in my Spotify App:

<body onload="sp = getSpotifyApi(1); j = sp.require('jquery'); tutorial = sp.require('tutorial'); tutorial.init();">

And then :

var $j = j.jQuery.noConflict();
$j("h2").text("ddd");

But it doesn't works...

Upvotes: 1

Views: 3299

Answers (5)

Andre
Andre

Reputation: 1

You can use jQuery by including a script tag on your index.html, but it's recommended that you load the jquery.js from a local copy within your app - otherwise you'll have to add the code.jquery.com suddomain to the RequiredPermissions array on your manifest.json.

Upvotes: 0

user507410
user507410

Reputation: 512

It works for me to put this in the top of the document. If my app is social and jquery resides in /js/jquery-1.7.1.min.js write following

sp.require("sp://social/js/jquery-1.7.1.min");

Upvotes: 1

John Frings
John Frings

Reputation: 21

For using jquery through a script tag in in an addon is to download jquery, save it to your addon folder and simply calling it like so:

<script type="text/javascript" src="jquery.js"></script>

This makes sense since the guidelines say:

[...]you must make sure to bundle all logic/layout/graphics/etc within your app bundle so that it can’t be replaced during runtime[...] In short - only request dynamic data from your own backend, and let all other data go into the app bundle itself.

That should mean only POST/GET requests can be made to external places and only to places listed in the manifest RequiredPermissions list. I'm sure it's possible to hack around this by doing something like allowing ajax.googleapis.com in the manifest, downloading the jquery through an external call and running it through some evil eval function.. but I don't really see any point.

Using a CDN is mostly useful for websites where you'd ideally have users use a cached version of jquery downloaded from the same CDN at an earlier time in order to save load times. In the spotify app case however, there's no real profit in hosting jquery remotely, even if every user of the app is always connected to the internet.

Upvotes: 2

Fredrik Jungstedt
Fredrik Jungstedt

Reputation: 1

I don't think you're allowed to access external files through a script-tag. Although, if you download the jquery.js and put it in your app folder you will be able to access it the way your example shows.

Upvotes: -1

Manuel van Rijn
Manuel van Rijn

Reputation: 10305

why not adding the jQuery.js file within the head?

so if you take the tutorial http://developer.spotify.com/download/spotify-apps-api/tutorial/ it would change to

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>My First App</title>
    <link rel="stylesheet" href="sp://import/css/adam.css">
    <link rel="stylesheet" href="tutorial.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
</head>
<body>
<h1 id="header">Hello, world!</h1>
</body>
</html>

Upvotes: 8

Related Questions