cancel
Showing results for 
Search instead for 
Did you mean: 

SAPUI5 and OData dynamic Login

Former Member
0 Kudos
2,114



can anybody share some standard code that sapui5 and odata dynamic login screen navigation ?

Means User has to pass input Username and Password atrun time and get login.




Thank you in advanced

Accepted Solutions (1)

Accepted Solutions (1)

naveenraj_a
Active Participant
0 Kudos

Hi Anil, What i suggest you is to try creating a SAPUI5 starter application, which will help you to generate and understand the Login and other data transfer operations from UI to gateway services.

So use the following links, which will help you.

http://scn.sap.com/community/developer-center/netweaver-gateway/blog/2013/06/20/creating-a-sapui5-st...

After code generation, have a look at Webcontent/Authentication folder, you can find the login JS files created which you can use for login from your application. By default the application will be using Form authentication.

Let me know if you face any issues.

Former Member
0 Kudos

I am getting error at validation time but in browser it is working fine.

The error is Unauthorised credential.

I want to pass the credential in the following fields when I enter login ,I want to pass the values to SAP.

I am using the following code:

var oLayout = new sap.ui.commons.layout.AbsoluteLayout({width:"340px",height:"150px"});

oLayout.addStyleClass("CustomStyle"); //Add some additional styling for the border

var oLabel = new sap.ui.commons.Label({text:"User Name"});

var oNameInput = new sap.ui.commons.TextField({width:"190px"});

oLabel.setLabelFor(oNameInput);

oLayout.addContent(oLabel, {right:"248px",top:"20px"});

oLayout.addContent(oNameInput, {left:"110px",top:"20px"});

oLabel = new sap.ui.commons.Label({text:"Password"});

oPWInput = new sap.ui.commons.PasswordField({width:"190px"});

oLabel.setLabelFor(oPWInput);

oLayout.addContent(oLabel, {right:"248px",top:"62px"});

oLayout.addContent(oPWInput, {left:"110px",top:"62px"});

var oLoginButton = new sap.ui.commons.Button({text:"Login",  press :"login", width:"133px"});

//oLoginButton.attachPress(login());

oLayout.addContent(oLoginButton, {left:"110px",top:"104px"});

// Attach the layout to the page

oLayout.placeAt("content");

</script>

  <script>

  

  login : function(oEvent) {

      jQuery.sap.require("sap.ui.model.odata.datajs");

      var serviceURI = "http://192.168.0.7:8000/sap/opu/odata/sap/YNEW_SRV/";

                var username = sap.ui.getCore().getControl("oNameInput") .getValue();

                var password = sap.ui.getCore().getControl("oPWInput") .getValue();

      var request = {

                headers : {

                                  "X-Requested-With" : "XMLHttpRequest",

                                   "Content-Type" : "application/atom+xml",

                                   "DataServiceVersion" : "2.0",

                                   "X-CSRF-Token" : "Fetch"

                                },

                                                                       requestUri : serviceURI,

                                                                       method : "GET",

                                                                       user : username,

                                                                       password : password

                                                             };

                                                               OData.request(request, function(data) {

                                                                       alert("success");

                                                             }, function(err) {

                                                                       alert('Error Code:'+ err.response.statusCode);

                                                             });

                                                   }

  </script>

Thank you Naveenraj

naveenraj_a
Active Participant
0 Kudos

Hi Anil, As i see you were using the ODataModel,


jQuery.sap.require("sap.ui.model.odata.datajs");

Why cant you use the ODataModel, constructor to pass your url with username and password?

For eg.

var serviceURI = "http://192.168.0.7:8000/sap/opu/odata/sap/YNEW_SRV/";

var username = sap.ui.getCore().getControl("oNameInput") .getValue();

var password = sap.ui.getCore().getControl("oPWInput") .getValue();

var OData = new sap.ui.model.odata.ODataModel(serviceURI,true ,username,password);

Please have a look at the below link for other methods of ODataModel,

JsDoc Report - SAP UI development Toolkit for HTML5 - API Reference - sap.ui.model.odata.ODataModel

Also make sure you use the same Library version like the previous link, you can see at the footer of the link for version details.

Former Member
0 Kudos

Thank you Naveenraj.

former_member223387
Discoverer
0 Kudos

Hi,

I tried this code above but it's not working. For me, I wanted to pass the Url dynamically and load odata  metadata and get a list of service name. I thought , I just need to change some parts of this code like this:

load: function(oEvent){

   jQuery.sap.require("sap.ui.model.odata.datajs");

  var serviceURI = sap.ui.getControl("oUrlInput").getValue();

  var OData = new sap.ui.model.odata.ODataModel(serviceURI,true);

       var request = {

                 headers : {

                                   "X-Requested-With" : "XMLHttpRequest",

                                    "Content-Type" : "application/atom+xml",

                                    "DataServiceVersion" : "2.0",

                                    "X-CSRF-Token" : "Fetch"

                                 },

                                                                        requestUri : serviceURI,

                                                                        method : "GET",

                                                                      

                                                              };

                                                                OData.request(request, function(data) {

                                                                        alert("success");

                                                              }, function(err) {

                                                                        alert('Error Code:'+ err.response.statusCode);

                                                              });

                                                    }

could you help me please!!

Thanks in advanced

miguelangel_daz
Explorer
0 Kudos

Incredible solution, now How could you do a logout, to clear the caché?

Answers (2)

Answers (2)

naveenraj_a
Active Participant
0 Kudos

Hi Anil, Can you explain us your requirement in more details.

What you mean by dynamic login?

What is your development scenario?

Former Member
0 Kudos

Means in login page when we input Username and Password it will go to SAP Backend and check .after that login successfully.

Thank you Naveenraj for your reply.

naveenraj_a
Active Participant
0 Kudos

Is yours a Custom SAPUI5 Application? Have you uploaded your application to Gateway system?

Former Member
0 Kudos

Yes naveenraj

This is a Custom SAPUI5 Application.

I want to use Odata service url and pass the username and password at run time to authenticate .

Thanks

Anil

Virinchy
Active Contributor
0 Kudos

Hi Anil,

If you look the previous example at the loginView.controller.js , the values can be passed dynamically , (values in inpLogin and inpPWD is passed via an ajax call to the backend for validation) .

code:

  var sURL = "/s/login.cshtml?login=" + this.byId("inpLogin").getValue() + 

                    "&password" + this.byId("inpPWD").getValue(); // compile URL to call 


The values are passed dynamically .

Former Member
0 Kudos

Hello Naveenraj

i am getting the attached error when validating whereas the url and credential is working fine in browser.

Virinchy
Active Contributor
0 Kudos

Please have a look at . and also a tutorial in open.sap.com contains an example using Login authentication .