Converet svg+xml base64 string to png file in Python

Question

I have the following svg+xml string:

s='data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDEiIGhlaWdodD0iNDEiIHZpZXdCb3g9IjAgMCA0MSA0MSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwKSI+CjxwYXRoIGQ9Ik0zNC40OTQxIDIzLjA3MUwzNi4xMTIzIDIzLjUwNDZDMzYuMTg3MiAyMy4yNzU3IDM2LjI1ODMgMjMuMDQ0NyAzNi4zMjU1IDIyLjgxMTlDMzYuMzYyMSAyMi42ODUgMzYuMzk3NiAyMi41NTc2IDM2LjQzMTkgMjIuNDI5M0MzOC43MzU4IDEzLjgzMTMgMzUuMTY4NCA1LjA0MzY3IDI4LjE4NzYgMC4zMjI1ODNDMjcuMzYxMyAtMC4yMzYyNTUgMjYuMjY3NCAwLjIzMjk1NyAyNi4wMDkyIDEuMTk2NTJMMjQuNjk1NCA2LjA5OTQzQzMxLjc5MzUgOC40MzYyNSAzNi4wMTkyIDE1Ljc1NTUgMzQuNDk0MSAyMy4wNzFaIiBmaWxsPSJ3aGl0ZSIvPgo8Y2lyY2xlIGN4PSIyNy4zNDQyIiBjeT0iMS4zNjA2IiByPSIxLjMzMTk5IiB0cmFuc2Zvcm09InJvdGF0ZSgxNSAyNy4zNDQyIDEuMzYwNikiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik01LjY2MzU5IDE3LjA4NzNMNC4wNDUzOCAxNi42NTM3QzMuOTcwNTUgMTYuODgyNiAzLjg5OTQ0IDE3LjExMzYgMy44MzIyMiAxNy4zNDY1QzMuNzk1NjEgMTcuNDczMyAzLjc2MDE1IDE3LjYwMDcgMy43MjU3OCAxNy43MjlDMS40MjE5NiAyNi4zMjcgNC45ODkyOSAzNS4xMTQ3IDExLjk3MDEgMzkuODM1N0MxMi43OTY0IDQwLjM5NDYgMTMuODkwNCAzOS45MjU0IDE0LjE0ODUgMzguOTYxOEwxNS40NjIzIDM0LjA1ODlDOC4zNjQyIDMxLjcyMjEgNC4xMzg1NSAyNC40MDI4IDUuNjYzNTkgMTcuMDg3M1oiIGZpbGw9IndoaXRlIi8+CjxjaXJjbGUgY3g9IjEyLjgxMzUiIGN5PSIzOC43OTc3IiByPSIxLjMzMTk5IiB0cmFuc2Zvcm09InJvdGF0ZSgtMTY1IDEyLjgxMzUgMzguNzk3NykiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0yMy4wNzA4IDUuNjYzNzFMMjMuNTA0NCA0LjA0NTVDMjMuMjc1NSAzLjk3MDY3IDIzLjA0NDUgMy44OTk1NiAyMi44MTE2IDMuODMyMzRDMjIuNjg0OCAzLjc5NTczIDIyLjU1NzMgMy43NjAyNyAyMi40MjkgMy43MjU5QzEzLjgzMTEgMS40MjIwOCA1LjA0MzQyIDQuOTg5NDEgMC4zMjIzMzggMTEuOTcwMkMtMC4yMzY0OTkgMTIuNzk2NiAwLjIzMjcxMyAxMy44OTA1IDEuMTk2MjggMTQuMTQ4N0w2LjA5OTE5IDE1LjQ2MjRDOC40MzYwMSA4LjM2NDMyIDE1Ljc1NTMgNC4xMzg2NyAyMy4wNzA4IDUuNjYzNzFaIiBmaWxsPSJ3aGl0ZSIvPgo8Y2lyY2xlIGN4PSIxLjM2MDM1IiBjeT0iMTIuODEzNiIgcj0iMS4zMzE5OSIgdHJhbnNmb3JtPSJyb3RhdGUoLTc1IDEuMzYwMzUgMTIuODEzNikiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0xNy4wODY5IDM0LjQ5NDVMMTYuNjUzMyAzNi4xMTI3QzE2Ljg4MjIgMzYuMTg3NSAxNy4xMTMyIDM2LjI1ODYgMTcuMzQ2MSAzNi4zMjU5QzE3LjQ3MjkgMzYuMzYyNSAxNy42MDA0IDM2LjM5NzkgMTcuNzI4NyAzNi40MzIzQzI2LjMyNjYgMzguNzM2MSAzNS4xMTQzIDM1LjE2ODggMzkuODM1NCAyOC4xODhDNDAuMzk0MiAyNy4zNjE2IDM5LjkyNSAyNi4yNjc3IDM4Ljk2MTQgMjYuMDA5NUwzNC4wNTg1IDI0LjY5NThDMzEuNzIxNyAzMS43OTM5IDI0LjQwMjUgMzYuMDE5NSAxNy4wODY5IDM0LjQ5NDVaIiBmaWxsPSJ3aGl0ZSIvPgo8Y2lyY2xlIGN4PSIzOC43OTc0IiBjeT0iMjcuMzQ0NiIgcj0iMS4zMzE5OSIgdHJhbnNmb3JtPSJyb3RhdGUoMTA1IDM4Ljc5NzQgMjcuMzQ0NikiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMjEuNjE2NyAxMS4wODk4QzE3LjI5MTIgMTAuMzEzOSAxMy4wMTY1IDEyLjc4MTkgMTEuNTI1NyAxNi45MTU5TDE5LjQ4NDIgMTkuMDQ4M0wyMS42MTY3IDExLjA4OThaTTExLjEwMjYgMTguNTQ0NEMxMC40MDI5IDIyLjgyMjYgMTIuODYyMiAyNy4wMjI3IDE2Ljk1MjIgMjguNDk3OEwxOS4wNDg3IDIwLjY3MzVMMTEuMTAyNiAxOC41NDQ0Wk0xOC41ODA4IDI4LjkyMDlDMjIuODEzMiAyOS42MTMyIDI2Ljk2OTIgMjcuMjEzNyAyOC40ODU5IDIzLjIwMjJMMjAuNjczOSAyMS4xMDlMMTguNTgwOCAyOC45MjA5Wk0yOC45MzM3IDIxLjU4MDNMMjEuMTA5NCAxOS40ODM4TDIzLjIzODYgMTEuNTM3NkMyNy4yOTM2IDEzLjA3MDcgMjkuNzAxNCAxNy4zMDA2IDI4LjkzMzcgMjEuNTgwM1oiIGZpbGw9IndoaXRlIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDAiPgo8cmVjdCB3aWR0aD0iNDAuMTc1OSIgaGVpZ2h0PSI0MC4xNzU5IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo='

I would like to convert the string to a png image in Python. I understand how this is done for normal base64 strings, but I'm not getting it to work with this svg+xml base64 format. The resulting png file should be a logo.

question from:https://stackoverflow.com/questions/65928859/converet-svgxml-base64-string-to-png-file-in-python

Answer 1

If you use an online base64 decoder you'll see that the payload is SVG-XML, not binary data.

<svg width="41" height="41" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
    <g clip-path="url(#clip0)">
        <path d="M34.4941 23.071L36.1123 23.5046C36.1872 23.2757 36.2583 23.0447 36.3255 22.8119C36.3621 22.685 36.3976 22.5576 36.4319 22.4293C38.7358 13.8313 35.1684 5.04367 28.1876 0.322583C27.3613 -0.236255 26.2674 0.232957 26.0092 1.19652L24.6954 6.09943C31.7935 8.43625 36.0192 15.7555 34.4941 23.071Z" fill="white"/>
        <circle cx="27.3442" cy="1.3606" r="1.33199" transform="rotate(15 27.3442 1.3606)" fill="white"/>
        <path d="M5.66359 17.0873L4.04538 16.6537C3.97055 16.8826 3.89944 17.1136 3.83222 17.3465C3.79561 17.4733 3.76015 17.6007 3.72578 17.729C1.42196 26.327 4.98929 35.1147 11.9701 39.8357C12.7964 40.3946 13.8904 39.9254 14.1485 38.9618L15.4623 34.0589C8.3642 31.7221 4.13855 24.4028 5.66359 17.0873Z" fill="white"/>
        <circle cx="12.8135" cy="38.7977" r="1.33199" transform="rotate(-165 12.8135 38.7977)" fill="white"/>
        <path d="M23.0708 5.66371L23.5044 4.0455C23.2755 3.97067 23.0445 3.89956 22.8116 3.83234C22.6848 3.79573 22.5573 3.76027 22.429 3.7259C13.8311 1.42208 5.04342 4.98941 0.322338 11.9702C-0.236499 12.7966 0.232713 13.8905 1.19628 14.1487L6.09919 15.4624C8.43601 8.36432 15.7553 4.13867 23.0708 5.66371Z" fill="white"/>
        <circle cx="1.36035" cy="12.8136" r="1.33199" transform="rotate(-75 1.36035 12.8136)" fill="white"/>
        <path d="M17.0869 34.4945L16.6533 36.1127C16.8822 36.1875 17.1132 36.2586 17.3461 36.3259C17.4729 36.3625 17.6004 36.3979 17.7287 36.4323C26.3266 38.7361 35.1143 35.1688 39.8354 28.188C40.3942 27.3616 39.925 26.2677 38.9614 26.0095L34.0585 24.6958C31.7217 31.7939 24.4025 36.0195 17.0869 34.4945Z" fill="white"/>
        <circle cx="38.7974" cy="27.3446" r="1.33199" transform="rotate(105 38.7974 27.3446)" fill="white"/>
        <path fill-rule="evenodd" clip-rule="evenodd" d="M21.6167 11.0898C17.2912 10.3139 13.0165 12.7819 11.5257 16.9159L19.4842 19.0483L21.6167 11.0898ZM11.1026 18.5444C10.4029 22.8226 12.8622 27.0227 16.9522 28.4978L19.0487 20.6735L11.1026 18.5444ZM18.5808 28.9209C22.8132 29.6132 26.9692 27.2137 28.4859 23.2022L20.6739 21.109L18.5808 28.9209ZM28.9337 21.5803L21.1094 19.4838L23.2386 11.5376C27.2936 13.0707 29.7014 17.3006 28.9337 21.5803Z" fill="white"/>
    </g>
    <defs>
        <clipPath id="clip0">
            <rect width="40.1759" height="40.1759" fill="white"/>
        </clipPath>
    </defs>
</svg>

You'd have to run the payload through an SVG to PNG renderer to generate the PNG image.