如何使用 sapui5 通过 REST 服务发送 json 模型

Question

我正在使用 SAPUI5，并且有一个 XML 表单，我想使用 Json 模型将数据发送到我的 REST 服务。

\n\n

我正在使用 SAPUI5 MVC 模型来制作我的应用程序。

\n\n

如何使用 REST 和 JSON 将数据发送到我的服务器？

\n\n

sap.ui.controller("controller.NewTicket", {\n\n    onInit: function() {\n        this.router = sap.ui.core.UIComponent.getRouterFor(this);\n        this.router.attachRoutePatternMatched(this._handleRouteMatched, this);\n    },\n    _handleRouteMatched:function(evt){\n        if("NewTicket" !== evt.getParameter("name")){\n            return;\n        }\n        var id = evt.getParameter("arguments").id;\n        var model = new sap.ui.model.json.JSONModel({id:id});\n        this.getView().setModel(model,"data");\n    },\n\n\n    enviar:function() {\n        jQuery.sap.require("sap.m.MessageBox");\n\n        // open a fully configured message box\n        sap.m.MessageBox.show("Confirmar a abertura do chamado?",\n                sap.m.MessageBox.Icon.QUESTION,\n                "Confirmar",\n                [sap.m.MessageBox.Action.YES, sap.m.MessageBox.Action.NO], \n                function(sResult) {\n            if(sResult == sap.m.MessageBox.Action.YES)    \n            {\n                var oModel = new sap.ui.model.json.JSONModel();\n                var aData = jQuery.ajax({\n                    type : "POST",\n                    contentType : "application/json",\n                    url : "http://192.168.0.32:9082/maxrest/rest/mbo/sr/?description="+ **deviceModel.sr.description** +"&_format=json&_compact=true&_verbose=true",\n                    dataType : "json",\n                    async: false, \n                    success : function(data,textStatus, jqXHR) {\n                        oModel.setData({modelData : data}); \n                        sap.m.MessageBox.show("ABRIU");\n                    },\n                    error : function(data,textStatus, jqXHR) {\n                        oModel.setData({modelData : data}); \n                        sap.m.MessageBox.show(textStatus);\n                    }\n            })}\n            else \n           {\n           }\n        },\n                sap.m.MessageBox.Action.YES);\n\n        var deviceModel = new sap.ui.model.json.JSONModel({\n            sr : [{\n                description: "",\n                long_description: ""\n            }]});\n        deviceModel.setDefaultBindingMode("TwoWay");\n        sap.ui.getCore().setModel(deviceModel);\n\n        jQuery.sap.require("sap.m.MessageToast");\n        sap.m.MessageToast.show(deviceModel.getData().sr.description);\n    }\n\n});\n

\n\n

还有景色...

\n\n

<mvc:View xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m" xmlns:co="sap.ui.commons"\nxmlns:f="sap.ui.layout.form" xmlns:core="sap.ui.core" controllerName="com.maximo.controller.NewTicket">\n\n<Page id="NewTicket" enableScrolling="true" title="{i18n>newTicket}" >\n    <content>\n            <f:SimpleForm >\n                <core:Title level="H5"\n                    text="O chamado ser\xc3\xa1 aberto em seu nome e voc\xc3\xaa ser\xc3\xa1 o usu\xc3\xa1rio afetado"/>\n                <Label text="Resumo"/>\n                <Input type="Text" maxLength="100" value="{/sr/description}"/>      \n                <Label text="Detalhes"/>      \n                <TextArea height="50%" cols="800" value="{/sr/long_description}"/>  \n            </f:SimpleForm>\n    </content>\n    <customHeader>\n        <Bar>\n            <contentLeft>           \n                <Button icon="sap-icon://nav-back" press="voltarMenu"/>\n            </contentLeft>\n            <contentMiddle>\n                <Label text="{i18n>newTicket}"/>\n            </contentMiddle>\n        </Bar>\n    </customHeader>\n    <footer>\n        <Bar>\n            <contentMiddle>\n                <Button id="btnSend" text="{i18n>send}" press="enviar" icon="sap-icon://add-activity-2"/>\n            </contentMiddle>\n        </Bar>\n    </footer>\n</Page>\n

\n\n

\n

Answer 1

根据我的经验，我发现使用“JSON”类型的 OData 模型更容易。

        var user = applicationContext.registrationContext.user;
        var password = applicationContext.registrationContext.password;
        var uri = "http://" + user + ":" + password + "@" + applicationContext.registrationContext.serverHost + ":8080/" + appId + "/"
        var headers = {
                //"Authorization" : "Basic " + btoa(applicationContext.registrationContext.user + ":" + applicationContext.registrationContext.password),
                "X-SMP-APPCID"  : applicationContext.applicationConnectionId
            };

        console.log("Try comunicating the first time");
        var oModel = new sap.ui.model.odata.ODataModel(uri, {json : true}, user, password, headers, false, false, false);

        oModel.setHeaders(headers);
        oModel.read("/Brand", onSuccess);   

                function onSuccess(result) {
                    sap.ui.getCore()....getView().getModel("Brands").setData(result);
                    };

这就是我处理所有请求的方式，无论是手动还是自动（在手动事件或页面事件上）。

对于“post”事件，我使用了令牌 fech：

     oModelRequest.setHeaders({ 
                "Access-Control-Allow-Origin" : "*",
                "Content-Type": "application/x-www-form-urlencoded",
                "X-CSRF-Token":"Fetch" 
                });

            // Declare a variable to handle the security token
            var token;

            // Create a read request to retreive the X-CSRF token
            oModelRequest.read('/Brand', null, null, false, 
                    function(oData, oResponse) {
                        if (oResponse.headers['x-csrf-token'] == undefined) {
                            //alert("Error on read process. No token ! Check read !");
                        }
                        token = oResponse.headers['x-csrf-token'];
                        }, 
                    function() {
                            alert(oModeli18n.getProperty("Brand_token_error"));
                            }
                        );

之后，我使用“Create”方法执行实际的“POST”：

        // Set POST request header using the X-CSRF token
        oModelRequest.setHeaders({
            "X-Requested-With": "XMLHttpRequest",
            "Content-Type": "application/json",
            "DataServiceVersion": "2.0",
            "Accept": "application/atom+xml,application/atomsvc+xml,application/xml",
            "X-CSRF-Token": token 
            });

        // Call the create request

        oModelRequest.create('/Brand', requestData, null, 
                  function(oData, oResponse) {
                    alert (Success);},
                  function(oData) {                     
                    alert(Error));
                    alert(oData.response.body);}
                      );