How to create a page using CSOM Javascript in sharepoint..?

Question

I would like to create a page using csom javascript code in sharepoint site with in the 'Page' library. The scenario is like, The javascript csom code creats page with all attributes and page data content in the 'Pages' library of the site.

Please share if any sample code you have.

Suggestions are appreciated.

Thank you in advance.

Answer 1

Sample Jsom code for your reference:

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="/_layouts/15/sp.runtime.js"></script>  
<script src="/_layouts/15/sp.js"></script>  
<script src="/_layouts/15/sp.publishing.js"></script>
<script type="text/javascript">  
    $(document).ready(function() {  
               createPublishingPage();
    });  

    var oWeb, clientContext, pageLayoutitem;  

    function createPublishingPage() {  
        //Get the client context,web and list object(Master Page Gallery)   
        clientContext = new SP.ClientContext.get_current();  
        oWeb = clientContext.get_web();  
        var oList = oWeb.get_lists().getByTitle('Master Page Gallery');  
        //Get the page layout by ID using which we will create a publishing page   
        pageLayoutitem = oList.getItemById(867);  
        //Load the client context and execute the batch   
        clientContext.load(oWeb);  
        clientContext.load(pageLayoutitem);  
        clientContext.executeQueryAsync(QuerySuccess, QueryFailure);  
    }  

    function QuerySuccess() {  
        //Create Publishing Page using PublishingPageInformation object   
        var newPublishingPage = SP.Publishing.PublishingWeb.getPublishingWeb(clientContext, oWeb);  
        var pageInfo = new SP.Publishing.PublishingPageInformation();  
        pageInfo.set_name("New Publishing Page.aspx");  
        pageInfo.set_pageLayoutListItem(pageLayoutitem);  
        newPage = newPublishingPage.addPublishingPage(pageInfo);
        console.log(newPage);
         var wikipage = newPage.get_listItem();
         console.log(wikipage);
           wikipage.set_item("Title","test");
           wikipage.update();
           clientContext.load(newPage);  
           clientContext.load(wikipage);
        clientContext.executeQueryAsync(SecondQuerySuccess, SecondQueryFailure);  
    }  

    function QueryFailure(sender, args) {  
        console.log('Request failed' + args.get_message());  
    }  

    function SecondQuerySuccess(sender, args) {  
        console.log("Publishing page created successfully.");  
    }  

    function SecondQueryFailure(sender, args) {  
        console.log('Request failed' + args.get_message());  
    }  
</script>

For pageLayoutitem=oList.getItemById(867), please replace with the real page layout id in your environment Master Page Gallery, I used "ArticleLeft.aspx" for test, the Id is 867:

Answer 2

 function createEntWikiPage(pageName,pageContent,success,error) { var templateRedirectionPageMarkup = "<%@ Page Inherits=\\"Microsoft.SharePoint.Publishing.TemplateRedirectionPage,Microsoft.SharePoint.Publishing,Version=14.0.0.0,Culture=neutral,PublicKeyToken=71e9bce111e9429c\\" %> <%@ Reference VirtualPath=\\"~TemplatePageUrl\\" %> <%@ Reference VirtualPath=\\"~masterurl/custom.master\\" %>"; var ctx = SP.ClientContext.get_current(); var wikiPages = ctx.get_web().get_lists().getByTitle("Pages"); var fileInfo = new SP.FileCreationInformation(); fileInfo.set_url(pageName); var fileContent = new SP.Base64EncodedByteArray(); for (var i = 0; i < templateRedirectionPageMarkup.length; i++) { fileContent.append(templateRedirectionPageMarkup.charCodeAt(i)); } fileInfo.set_content(fileContent); fileInfo.set_overwrite(true); var wikiFile = wikiPages.get_rootFolder().get_files().add(fileInfo); var wikiPage = wikiFile.get_listItemAllFields(); wikiPage.set_item("PublishingPageContent",pageContent); var siteUrl = _spPageContextInfo.siteServerRelativeUrl == '/' ? _spPageContextInfo.siteServerRelativeUrl : _spPageContextInfo.siteServerRelativeUrl + '/'; wikiPage.set_item("PublishingPageLayout",siteUrl + "_catalogs/masterpage/EnterpriseWiki.aspx, Basic Page"); wikiPage.update(); ctx.executeQueryAsync( function() { success(wikiFile); },error); } 

I tried the above the code. its working fine for me.