Newer Version Available
Initiating OAuth Flow
The following code examples show you how to start the authorization process in your canvas app using OAuth.
1swfobject.registerObject("clippy.codeblock-0", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17<html>
18<head>
19 <script type="text/javascript" src="/sdk/js/canvas-all.js"></script>
20</head>
21<body>
22 <script>
23
24 function loginHandler(e) {
25 var uri;
26 if (! Sfdc.canvas.oauth.loggedin()) {
27 uri = Sfdc.canvas.oauth.loginUrl();
28 Sfdc.canvas.oauth.login(
29 {uri : uri,
30 params: {
31 response_type : "token",
32 client_id : "3MVG9lKcPoNINVBLigmW.8dAn4L5HwY VBzxbW5FFdzvU0re2
33 f7o9aHJNUpY9ACdh.3SUgw5rF2nSsC9_cRqzD",
34 redirect_uri : encodeURIComponent(
35 "https://demoapp1234.herokuapp.com/sdk/callback.html")
36 }});
37 }
38 else {
39 Sfdc.canvas.oauth.logout();
40 login.innerHTML = "Login";
41 Sfdc.canvas.byId("oauth").innerHTML = "";
42 }
43 return false;
44 }
45
46 // Bootstrap the page once the DOM is ready.
47 Sfdc.canvas(function() {
48 // On Ready...
49 var login = Sfdc.canvas.byId("login"),
50 loggedIn = Sfdc.canvas.oauth.loggedin(),
51 token = Sfdc.canvas.oauth.token()
52 login.innerHTML = (loggedIn) ? "Logout" : "Login";
53 if (loggedIn) {
54 // Only displaying part of the OAuth token for better formatting.
55 Sfdc.canvas.byId("oauth").innerHTML = Sfdc.canvas.oauth.token()
56 .substring(1,40) + "…";
57 }
58 login.onclick=loginHandler;
59 });
60 </script>
61 <h1 id="header">Force.com Canvas OAuth App</h1>
62 <div>
63 access_token = <span id="oauth"></span>
64 </div>
65 <div>
66 <a id="login" href="#">Login</a><br/>
67 </div>
68</body>
69</html>
70