"Getting 'Failed to load resource: the server responded with a status of 404' error in Sencha when submitting form data to ASP.NET Web API"

Question

Ext.define('movieRentalApp.view.main.Form', {
    extend: 'Ext.form.Panel',
    xtype: 'Form',
    title: 'Add a new Movie',
    width: 350,
    bodyPadding: 5,
    url: 'https://localhost:7271/Movies',
    method: 'POST',
    layout: 'anchor',
    defaults:{
        anchor: '100%',
    },
    defaultType: 'textfield',
    items: [
        {
            fieldLabel:'Id',
            name: 'nameInp',
            allowBlank:'false',
        },
    ],
    jsonSubmit: true,
    buttons: [
        {
            text: 'submit',
            formBind: true,
            disabled: true,
            handler: function(){
                var form = this.up('form');
                if(form.isValid()){
                    form.submit({
                        success: function(form,action){
                            Ext.Msg.alert(
                                'success',
                                'The new movie is added'
                            );
                        },
                        failure: function(){
                            Ext.Msg.alert('Failure','Oops, something went wrong!');
                        }
                    });
                }
            }
        }
    ]
});

I have verified that the URL (https://localhost:7271/Movies) is correct and the API endpoint is properly configured in my ASP.NET Web API. I also checked for CORS issues, but the problem persists. How can I troubleshoot and resolve this error? Any help would be appreciated.