{"id":37851,"date":"2025-02-23T16:28:52","date_gmt":"2025-02-23T10:58:52","guid":{"rendered":"https:\/\/techmasala.addastudents.com\/dev\/?p=37851"},"modified":"2025-02-23T16:28:55","modified_gmt":"2025-02-23T10:58:55","slug":"how-to-get-a-file-pdf-image-from-ms-crm-table-in-base64-format-using-javascript","status":"publish","type":"post","link":"https:\/\/techmasala.addastudents.com\/dev\/how-to-get-a-file-pdf-image-from-ms-crm-table-in-base64-format-using-javascript\/","title":{"rendered":"How to Get a File (PDF, Image) from MS CRM Table in Base64 Format Using JavaScript?"},"content":{"rendered":"\n

Microsoft Dynamics 365 CRM allows storing files such as PDFs and images in File<\/strong> or Image<\/strong> columns. Retrieving these files in Base64 format<\/strong> using JavaScript can be useful for displaying images, downloading files, or processing data in web applications.<\/p>\n\n\n\n

In this article, we will explore how to retrieve a file<\/strong> from a table in Dynamics 365 CRM using JavaScript and Web API<\/strong> and convert it into Base64 format.<\/p>\n\n\n\n


Why Use Base64 Format?<\/strong><\/h3>\n\n\n\n

Base64 encoding is useful when:<\/p>\n\n\n\n

    \n
  • You want to display an image without saving it to disk.<\/li>\n\n\n\n
  • You need to send a file via API as a string.<\/li>\n\n\n\n
  • You want to embed a file directly in an HTML page.<\/li>\n<\/ul>\n\n\n\n


    Steps to Retrieve a File in Base64 Format<\/strong><\/h2>\n\n\n\n

    To retrieve a file from a table in Microsoft Dynamics 365 CRM<\/strong>, follow these steps:<\/p>\n\n\n\n

    1. Use Xrm.WebApi to Fetch the File Column<\/strong><\/h3>\n\n\n\n

    The Xrm.WebApi.retrieveRecord<\/code> function helps fetch data from a CRM table.<\/p>\n\n\n\n

    2. Extract the File Content in Base64 Format<\/strong><\/h3>\n\n\n\n

    The response contains the Base64-encoded file<\/strong>, which can be used as needed.<\/p>\n\n\n\n

    3. Handle Different File Types<\/strong><\/h3>\n\n\n\n

    Base64 strings can be used to:<\/p>\n\n\n\n

      \n
    • Display images<\/strong> in <img><\/code> elements.<\/li>\n\n\n\n
    • Download files<\/strong> using a link.<\/li>\n<\/ul>\n\n\n\n

      JavaScript Code Example<\/strong><\/h2>\n\n\n\n
      function getFileInBase64(entityName, recordId, columnName, mimeType) {\n    var apiUrl = `\/api\/data\/v9.0\/${entityName}(${recordId})\/${columnName}`;\n\n    Xrm.WebApi.online.retrieveRecord(entityName, recordId, `?$select=${columnName}`)\n        .then(function (result) {\n            if (result[columnName]) {\n                console.log(\"Base64 File Data:\", result[columnName]); \/\/ Base64 string of the file\n                \n                \/\/ Example: Show as an image (if it's an image file)\n                if (mimeType.startsWith(\"image\/\")) {\n                    let imgElement = document.createElement(\"img\");\n                    imgElement.src = `data:${mimeType};base64,` + result[columnName];\n                    document.body.appendChild(imgElement);\n                } else {\n                    \/\/ Download as a file (for PDFs, etc.)\n                    let link = document.createElement(\"a\");\n                    link.href = `data:${mimeType};base64,` + result[columnName];\n                    link.download = \"downloaded_file\";\n                    document.body.appendChild(link);\n                    link.click();\n                    document.body.removeChild(link);\n                }\n            } else {\n                console.log(\"No file found in the column.\");\n            }\n        })\n        .catch(function (error) {\n            console.error(\"Error retrieving file:\", error.message);\n        });\n}\n\n\/\/ Example Usage\nvar entityName = \"account\";  \/\/ Change to your table name\nvar recordId = \"00000000-0000-0000-0000-000000000000\"; \/\/ Change to your record GUID\nvar columnName = \"documentbody\";  \/\/ Change to your file column name\nvar mimeType = \"application\/pdf\"; \/\/ Change based on file type (image\/png, application\/pdf, etc.)\n\ngetFileInBase64(entityName, recordId, columnName, mimeType);\n<\/code><\/pre>\n\n\n\n
      How This Code Works?<\/strong><\/h2>\n\n\n\n
      \u2705 Fetch File Data:<\/strong><\/h3>\n\n\n\n
        \n
      • The Xrm.WebApi.online.retrieveRecord<\/code> method is used to fetch data.<\/li>\n\n\n\n
      • The file content<\/strong> is returned in Base64 format inside the columnName<\/code> field.<\/li>\n<\/ul>\n\n\n\n
        \u2705 Display Image:<\/strong><\/h3>\n\n\n\n
          \n
        • If the MIME type<\/strong> starts with \"image\/\"<\/code>, the Base64 data is set as the src<\/code> of an <img><\/code> element.<\/li>\n<\/ul>\n\n\n\n
          \u2705 Download File (PDF, etc.):<\/strong><\/h3>\n\n\n\n
            \n
          • A temporary anchor (<a><\/code>)<\/strong> is created to trigger the file download using the Base64 data.<\/li>\n<\/ul>\n\n\n\n
            Use Cases of This Approach<\/strong><\/h2>\n\n\n\n
            \u2714\ufe0f Displaying user profile images stored in CRM.<\/strong>
            \u2714\ufe0f Retrieving and embedding product images on a webpage.<\/strong>
            \u2714\ufe0f Downloading stored PDF documents, invoices, or agreements from CRM.<\/strong>

            <\/p>\n\n\n\n
            Retrieving files from Dynamics 365 CRM in Base64 format<\/strong> using JavaScript is simple with the Web API<\/strong>. This method allows you to use files directly in web applications without additional storage or processing.<\/p>\n","protected":false},"excerpt":{"rendered":"
            Microsoft Dynamics 365 CRM allows storing files such as PDFs and images in File or Image columns. Retrieving these files in Base64 format using JavaScript can be useful for displaying images, downloading files, or processing data in web applications. In this article, we will explore how to retrieve a file from a table in Dynamics […]<\/p>\n","protected":false},"author":1,"featured_media":37855,"comment_status":"open","ping_status":"open","sticky":true,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71,70,17,5],"tags":[962,93,891,47,45],"class_list":["post-37851","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-learn-javascript-online","category-learn-technology-free","category-learn-microsoft-dynamics-crm","category-technology","tag-base64","tag-coding","tag-dynamics-365-crm","tag-javascript","tag-js"],"_links":{"self":[{"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/posts\/37851","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/comments?post=37851"}],"version-history":[{"count":3,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/posts\/37851\/revisions"}],"predecessor-version":[{"id":37854,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/posts\/37851\/revisions\/37854"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/media\/37855"}],"wp:attachment":[{"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/media?parent=37851"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/categories?post=37851"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/techmasala.addastudents.com\/dev\/wp-json\/wp\/v2\/tags?post=37851"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}