How to open Documents in Browser in SharePoint classic view

In SharePoint, Microsoft provides the below URL format to meet the user's expectation.

The URL format you are looking for is,

<SiteURL>/_layouts/15/WopiFrame.aspx?sourcedoc=<Doc URL>&file=<File Name>&action=default";



<script  type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    
        
<script  type="text/javascript"> 
    (function () {
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides({  
            Templates: {  
                Fields: {  
                    'LinkFilename': {  
                        'View': function (ctx) {  
                            var currentVal = '';  
                            //from the context get the current item and it's value   
                            if (ctx != null && ctx.CurrentItem != null)  
                                currentVal = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];  
                  
                            if(ctx.CurrentItem.File_x0020_Type == "pptx"||ctx.CurrentItem.File_x0020_Type == "pdf" ||ctx.CurrentItem.File_x0020_Type == "xlsx" ||ctx.CurrentItem.File_x0020_Type == "docx" ||ctx.CurrentItem.File_x0020_Type == "doc"){  
                                el = "<div><a id="+ctx.CurrentItem.UniqueId+" class='ms-listlink ms-draggable' onclick='OpenFileInModal(this);return false;' href='" + ctx.CurrentItem.FileRef + "'>" + ctx.CurrentItem.FileLeafRef + "</a></div>";  
                            }else  
                            {  
                                el = "<div><a id="+ctx.CurrentItem.UniqueId+" class='ms-listlink ms-draggable'  href='" + ctx.CurrentItem.FileRef + "'>" + ctx.CurrentItem.FileLeafRef + "</a></div>";  
                            }  
                            // Render the HTML5 file input in place of the OOTB  
                            return el;  
                        }  
                    }  
                }  
            }  
        });  

    })();

function OpenFileInModal(sender) {  
    var options = SP.UI.$create_DialogOptions();  
    var documentID=$(sender).attr('id');       
    var str=_spPageContextInfo.webAbsoluteUrl +"/_layouts/15/WopiFrame.aspx?sourcedoc=" + documentID + "&file="+sender.text+"&action=default";     
    //Using a generic object.  
    var options = {  
        title: "",  
        width: 1000,  
        height: 1200,  
        url: str  
    };  
  
    SP.UI.ModalDialog.showModalDialog(options);  
}  
</script>