Я новичок в SAPUI, и я делаю некоторые тесты с OData.Я создал простой проект, показывающий продукты службы oData и кнопки для create/delete/edit
продукта.
Когда я пытаюсь создать новый продукт или delete/update
, я получаю:
POST MyUri ... / OData / OData.svc 405 (метод не разрешен).
Это консоль моего браузера: ![enter image description here](https://i.stack.imgur.com/7vMxq.png)
Мои файлы:
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8' />
<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m, sap.ui.commons, sap.ui.table"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
var oModel = new sap.ui.model.odata.ODataModel("https://cors-anywhere.herokuapp.com/http://services.odata.org/V2/OData/OData.svc/");
/* var oModel = new sap.ui.model.odata.ODataModel("https://services.odata.org/OData/OData.svc/"); */
/* var oModel = new sap.ui.model.odata.v4.ODataModel("http://localhost:8080/odata/DemoService.svc/"); */
sap.ui.getCore().setModel(oModel);
var aColumn1 = [
new sap.m.Column({
header: new sap.m.Label({
text: "ID"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Name"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Description"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Release Date"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Rating"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Price"
})
}),
new sap.m.Column({
header: new sap.m.Label({
text: "Supplier"
})
})
];
var oTemplate1 = new sap.m.ColumnListItem({
cells: [
new sap.m.Text({
text: "{ID}"
}),
new sap.m.Text({
text: "{Name}"
}),
new sap.m.Text({
text: "{Description}"
}),
new sap.m.Text({
text: "{ReleaseDate}"
}),
new sap.m.Text({
text: "{Rating}"
}),
new sap.m.Text({
text: "{Price}"
}),
new sap.m.Text({
text: "{Supplier/Name}"
}),
]
});
var oTable1 = new sap.m.Table({
id: "table",
columns: aColumn1
});
oTable1.bindItems({
path: '/Products',
parameters:{expand : 'Supplier'},
template:oTemplate1
});
console.log(oTable1);
var page = new sap.m.Page({
id: "page",
title: "OData Web App",
showNavButton: false,
content: [oTable1]
});
var app = new sap.m.App();
app.addPage(page);
app.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Product.controller.js (я пробовал разные uri)
sap.ui.controller("products.Product", {
/**
* Called when a controller is instantiated and its View controls (if available) are already created.
* Can be used to modify the View before it is displayed, to bind event handlers and do other one-time initialization.
* @memberOf products.Product
*/
onInit: function() {
// var oModel = new sap.ui.model.odata.ODataModel("proxy/https/services.odata.org/V3/OData/OData.svc");
// var oModel = new sap.ui.model.odata.ODataModel("proxy/https/services.odata.org/V3/(S(k42qhed3hw4zgjxfnhivnmes))/OData/OData.svc");
// var oModel = new sap.ui.model.odata.ODataModel("proxy/https/services.odata.org/V3/(S(blacksheep))/OData/OData.svc");
// var oModel = new sap.ui.model.odata.ODataModel("proxy/http/services.odata.org/V3/(S(au3m0bej1w40a00fq1tpt540))/OData/OData.svc");
// var oModel = new sap.ui.model.odata.ODataModel("proxy/https/services.odata.org/V3/(S(3ngooq0fkelm0nublhbj01xu))/OData/OData.svc");
var oModel = new sap.ui.model.odata.ODataModel("proxy/https/services.odata.org/V3/(S(gvhowm5dxqs50fz45zzouph3))/OData/OData.svc");
oModel.oHeaders = {
"DataServiceVersion": "3.0",
"MaxDataServiceVersion": "3.0"
};
// this.getView().setModel(oModel, "products");
sap.ui.getCore().setModel(oModel,"products");
// console.log(oModel);
},
/**
* Similar to onAfterRendering, but this hook is invoked before the controller's View is re-rendered
* (NOT before the first rendering! onInit() is used for that one!).
* @memberOf products.Product
*/
// onBeforeRendering: function() {
//
// },
/**
* Called when the View has been rendered (so its HTML is part of the document). Post-rendering manipulations of the HTML could be done here.
* This hook is the same one that SAPUI5 controls get after being rendered.
* @memberOf products.Product
*/
onAfterRendering: function() {
$("#formId").hide();
},
/**
* Called when the Controller is destroyed. Use this one to free resources and finalize activities.
* @memberOf products.Product
*/
// onExit: function() {
//
// }
mode: 0,
resetForm: function(){
$("#name").val('');
$("#description").val('');
$("#price").val('');
$("#rating").val('');
$("#id").val('');
},
create: function(){
this.mode = 'create';
this.resetForm();
$("#formId").slideDown(300, function() {
// var id = sap.ui.getCore().byId('tableId')._getRowCount();
// $("#id").val(id);
});
},
edit: function(){
this.mode = 'edit';
var oTable = sap.ui.getCore().byId('tableId');
var selected = oTable.getSelectedIndex();
// alert(selected);
if(selected ==-1){
alert("Select row");
}else{
$("#formId").slideDown(function(){
var data = oTable.getModel('products').oData['Products('+ selected +')'];
var id = data.ID;
var description = data.Description;
var price = data.Price;
var rating = data.Rating;
var name = data.Name;
$("#name").val(name);
$("#description").val(description);
$("#price").val(price);
$("#rating").val(rating);
$("#id").val(id);
})
}
},
removeId: 0,
remove: function(){
this.mode = 'delete';
var oTable = sap.ui.getCore().byId('tableId');
var selected = oTable.getSelectedIndex();
if(selected ==-1){
alert("Select row");
}else{
var data = oTable.getModel('products').oData['Products('+ selected +')'];
this.removeId = data.ID;
this.save();
}
},
save: function(){
var requestObj = {
requestUri: '',
method: '',
headers: {
"X-Requested-With": "XMLHttpRequest",
"Content-Type": "application/json;odata=minimalmetadata",
"DataServiceVersion": "3.0",
"MaxDataServiceVersion": "3.0",
"Accept": "application/json;odata=minimalmetadata"
}
};
var newData={
"odata.type": "ODataDemo.Product",
"ID": $("#id").val(),
"Name": $("#name").val(),
"Description": $("#description").val(),
"ReleaseDate": $("#date").val(),
// "DiscontinuedDate": null
"Rating": $("#rating").val(),
"Price": $("#price").val(),
}
if(this.mode == 'create'){
// var url = "proxy/https/services.odata.org/V3/(S(3ngooq0fkelm0nublhbj01xu))/OData/OData.svc";
var url = "proxy/https/services.odata.org/V3/(S(gvhowm5dxqs50fz45zzouph3))/OData/OData.svc";
var method = "POST";
requestObj.requestUri = url;
requestObj.method = method;
requestObj.data = newData;
}else if(this.mode == 'edit'){
var id = $("#id").val();
// var url = "proxy/https/services.odata.org/V3/(S(3ngooq0fkelm0nublhbj01xu))/OData/OData.svc";
var url = "proxy/https/services.odata.org/V3/(S(gvhowm5dxqs50fz45zzouph3))/OData/OData.svc";
var method = "PUT";
requestObj.requestUri = url;
requestObj.method = method;
requestObj.data = newData;
}else if(this.mode == 'delete'){
var id = this.removeId;
var url = "proxy/https/services.odata.org/V3/(S(gvhowm5dxqs50fz45zzouph3))/OData/OData.svc";
var method = "DELETE";
requestObj.requestUri = url;
requestObj.method = method;
}
OData.request(requestObj, function() {
sap.ui.getCore().getModel('products').refresh();
$("#formId").slideUp();
});
}
});
Product.view.js
sap.ui.jsview("products.Product", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf products.Product
*/
getControllerName : function() {
return "products.Product";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf products.Product
*/
createContent : function(oController) {
var oMatrix = new sap.ui.commons.layout.MatrixLayout({
layoutFixed: true,
width: '300px',
columns: 3
});
oMatrix.createRow(
new sap.ui.commons.Button({
text: "Create",
width: '100px',
press: function(){
oController.create();
}
}),
new sap.ui.commons.Button({
text: "Edit",
width: '100px',
press: function(){
oController.edit();
}
}),
new sap.ui.commons.Button({
text: "Delete",
width: '100px',
press: function(){
oController.remove();
}
})
);
var oLayout = new sap.ui.layout.form.SimpleForm("formId",{
title: "Product Detail",
content: [
new sap.ui.commons.Label({text: "ID"}),
// new sap.ui.commons.TextField("id",{width: '200px', editable: false}),
new sap.ui.commons.TextField("id",{width: '200px'}),
new sap.ui.commons.Label({text: "Name"}),
new sap.ui.commons.TextField("name",{width: '200px'}),
new sap.ui.commons.Label({text: "Description"}),
new sap.ui.commons.TextField("description",{width: '200px'}),
new sap.ui.commons.Label({text: "Price"}),
new sap.ui.commons.TextField("price",{width: '200px'}),
new sap.ui.commons.Label({text: "Rating"}),
new sap.ui.commons.TextField("rating",{width: '200px'}),
new sap.ui.commons.Label({text: "ReleaseDate"}),
new sap.ui.commons.TextField("date",{width: '200px', value:"2019-09-19T22:00:00"}),
new sap.ui.commons.Label({text: ""}),
new sap.ui.commons.Button({
text: "Save",
width: '100px',
press: function(){
oController.save()
}
})
]
});
//TABLE
var oTable = new sap.ui.table.Table("tableId",{
visibleRowCount: 8,
editable: false
});
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "ID"}),
visible: true,
template: new sap.ui.commons.TextView({text: "{products>ID}"})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Name"}),
visible: true,
template: new sap.ui.commons.TextView({text: "{products>Name}"})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Description"}),
visible: true,
template: new sap.ui.commons.TextView({text: "{products>Description}"})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Price"}),
visible: true,
template: new sap.ui.commons.TextView({text: "{products>Price}"})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Rating"}),
visible: true,
template: new sap.ui.commons.TextView({text: "{products>Rating}"})
}));
oTable.bindRows("products>/Products")
var ele = [oMatrix,oTable,oLayout]
return ele;
}
});
я пробовалдругой URI, и я думаю, что функция создания в порядке ... Советы?Спасибо за помощь