3

I am a beginner in angular js and Salesforce.

I am trying to build an application which implements the give link step by step.

https://developer.salesforce.com/docs/atlas.en-us.api_rest.meta/api_rest/intro_understanding_web_server_oauth_flow.htm

Step 1 -> using the below link I got the authentication code

window.location.replace("login.salesforce.com/services/oauth2/authorize?response_type=code&client_id=3MVG9ZL0ppGP5UrCf3JELrQofxaHFFDpsnOhdjkPa8KLI2Z.trnjgMHlJgCQX_FPXdWGzVjLzRzMAZCKxpj4g&redirect_uri=localhost:63342/www/index.html#/&immediate=true");

The redirected url with authentication_code: https://localhost:63342/www/index.html?code=aPrxqJ8A8kLOza9GSNhD7xBRi5wDYopPRYVlQrqIwW.7hGVrixMu3uTfMhnUSHNZzClGdMKahw%3D%3D#/

step 2 -> Next was to get the access token using the above received code

The method is post

url is :login.salesforce.com/services/oauth2/token

And my $http POST method is as follows

        $http({
            method: 'POST',
            url: 'https://login.salesforce.com/services/oauth2/token',
            data: {
                'grant_type': 'authorization_code',
                'code': $scope.code,
                'client_id': 'consumer_key',
                'client_secret': 'consumer_secret',
                'redirect_uri': 'https://localhost:63342/www/index.html#/'
            }
        }).then(function successCallback(response) {
            alert(response.access_token);
        }, function errorCallback(response) {
            alert(response.error);
        });

I tried adding a debugger and got to know that control never goes to success function rather it always goes to error function.

FYI: $scope.code is giving perfectly fine results.

Please see if there is any error I am doing.

Thanks in advance.

EDIT: I am getting an error as

**ERROR**

Improve this question
2
  • 1
    Great quetion, with all required details, do you see any errors, what are you asking the community to check? Commented Oct 5, 2015 at 17:12
  • Yes I see an error in network in dev tools Commented Oct 6, 2015 at 7:22

2 Answers 2

Reset to default
1

I think the callback always goes to error function because you are trying to send a request via JavaScript to a system/ server in different domain. These type of request are not allowed by browsers unless the target server sends a Access Control Allow Origin header with value of your domain This policy is enforced by browser. See CORS. You can read more about it on MDN.

So whenever you send a Authorisation request, your browser send a preflight OPTIONS request automatically before the POST request. This option request would return in error due to your browsers CORS policy. Now you cannot have Salesforce servers send the Access Control Allow Origin header because the login servers of Salesforce are not in your control.

You can check this by opening developer tools on your browser.

These calls are allowed when a server calls a server.

Solution

The webserver flow can be used when you are making requests from one server to another. In your case you are sending request from JavaScript.

Since you are on localhost, I think that you are using only HTML and JS.

If you have a back end server, you should make authentication calls from the server not directly from JavaScript.

OR

There is a separate user flow for application for client side processing only, where you can use JS to perform login to system

User Agent Authorisation flow

P.S. IF you trying to create a hybrid application, then the approach you have taken will work.

Improve this answer
1
  • Yes I am using HTML and JS only and I am creating a hybrid app. I tried the USER AGENT FLOW and I received the access_token. But just wanted your suggestion about which would be better for a hybrid application. USER AGENT or a WEB SERVER FLOW. thanks Commented Oct 6, 2015 at 7:39
1

One problem is that the https://login.salesforce.com/services/oauth2/token endpoint requires the data posted to be in application/x-www-form-urlencoded format but you are sending the data in JSON format. Change that.

(This format is part of the OATH2 spec.)

Improve this answer
4
  • I tried adding in the header the content-type but still not working. I also tried the transformRequest: function(obj) { var str = []; for(var p in obj) str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); return str.join("&");} But still not worked. Commented Oct 6, 2015 at 7:32
  • @AnKarthik In the 400 response, is there anything useful in the response body. (You can click through to that in the dev tools.) Commented Oct 6, 2015 at 7:44
  • In request body i there is Accept :application/json, text/plain, / ** and **Content-Type application/x-www-form-urlencoded; charset=UTF-8. i dont know the difference. Commented Oct 6, 2015 at 7:49
  • @AnKarthik I was talking about the response body when you get the 400 status back - there may be useful error explanation there. Commented Oct 6, 2015 at 8:03

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.