全部 ApiPost使用 后端 前端 接口测试 IOS Android 数据库 2022 测试技术 工具
问答 / 问答详情

[已处理] svg如何进行可视化渲染

ApiPost使用 135次浏览

公司的验证码接口,返回的是一个svg的数据结构,请问如何将这个svg进行可视化渲染


我尝试了

1.将svg转base64

发现转换时,控制台没有任何输出,不清楚是什么失败原因

2.直接模版展示svg

发现被转义成文本了


各位大佬,还有没有其他方式吗?

| 0 收藏

2 个回答

使用nodejs的api尝试了一下,成功!!


我们接口返回的数据结构

{
    "data": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"28\"><rect width=\"100%\" height=\"100%\" fill=\"#9fccd5\"/><path d=\"M5 3 C49 22,57 4,98 18\" stroke=\"#000000\" fill=\"none\"/><path fill=\"#000000\" d=\"M57.15 16.16L57.11 16.11L57.18 16.19Q56.15 16.07 55.49 16.84L55.46 16.81L55.52 16.86Q54.93 17.70 54.82 18.72L54.78 18.68L54.78 18.68Q54.76 19.88 55.34 20.40L55.33 20.39L55.16 20.22Q55.74 20.74 56.86 20.67L56.88 20.70L56.90 20.72Q58.10 20.72 58.70 20.35L58.61 20.26L58.76 20.42Q59.26 19.71 59.26 18.87L59.20 18.82L59.30 18.91Q59.30 18.71 59.26 18.51L59.31 18.56L59.23 18.47Q59.20 17.51 58.61 16.79L58.69 16.87L58.61 16.79Q58.06 16.10 57.16 16.16ZM56.98 22.16L56.94 22.12L56.88 22.06Q54.55 22.08 53.79 21.67L53.87 21.75L53.86 21.73Q53.32 21.34 53.22 20.42L53.30 20.50L53.22 20.42Q53.25 20.11 53.27 19.72L53.25 19.70L53.16 19.61Q53.23 19.09 53.23 18.84L53.32 18.94L53.23 18.84Q53.62 17.46 53.70 17.09L53.64 17.03L53.52 16.90Q53.89 15.99 54.34 15.24L54.31 15.21L54.36 15.26Q55.70 12.83 58.88 9.42L58.96 9.50L58.90 9.44Q60.31 9.26 61.49 8.83L61.43 8.76L61.50 8.83Q57.86 12.87 56.15 15.13L56.21 15.20L56.07 15.05Q56.58 14.77 57.28 14.77L57.31 14.80L57.33 14.83Q59.18 14.90 60.00 15.94L59.95 15.89L59.95 15.89Q60.74 16.85 60.93 18.75L60.85 18.67L60.88 18.70Q60.86 19.03 60.86 19.35L60.91 19.40L60.95 19.45Q60.81 20.98 59.63 21.55L59.75 21.67L59.65 21.57Q59.00 21.90 56.92 22.10ZM58.23 23.47L58.22 23.46L58.22 23.47Q58.87 23.40 59.93 23.44L59.91 23.42L59.93 23.44Q60.87 23.54 61.70 23.15L61.66 23.11L61.65 23.10Q62.18 22.61 62.18 21.65L62.28 21.75L62.25 21.72Q62.29 21.50 62.20 20.97L62.24 21.01L62.23 21.00Q62.05 20.38 62.05 20.13L62.02 20.11L62.08 20.16Q61.70 17.73 60.85 16.71L60.70 16.56L60.84 16.70Q60.68 16.53 60.60 16.40L60.70 16.50L60.44 16.28L60.36 16.22L60.39 16.25Q60.29 16.07 59.96 15.56L60.00 15.60L60.00 15.60Q59.48 15.06 58.42 14.81L58.30 14.69L58.36 14.76Q59.09 13.98 60.68 12.00L60.64 11.96L62.78 8.99L62.88 9.10Q62.02 9.54 60.73 9.95L60.66 9.87L60.81 10.03Q61.27 9.47 62.23 8.41L62.13 8.30L62.20 8.37Q60.92 8.95 58.84 9.26L58.79 9.20L58.93 9.35Q55.70 12.33 54.11 14.98L54.25 15.13L54.26 15.14Q53.28 16.32 52.97 19.66L53.09 19.79L53.12 19.81Q53.06 20.10 53.10 20.61L53.14 20.64L52.98 20.49Q53.04 21.44 53.63 21.93L53.70 22.00L53.68 21.98Q53.84 22.02 53.82 22.04L53.92 22.14L53.78 22.00Q54.12 22.63 54.55 22.85L54.48 22.78L54.54 22.84Q55.33 23.22 56.37 23.32L56.39 23.35L56.24 23.20Q56.42 23.38 58.30 23.54ZM58.15 17.50L58.16 17.51L58.09 17.44Q58.44 17.42 58.95 17.69L58.81 17.55L58.86 17.59Q59.08 18.14 59.08 18.49L59.10 18.51L59.13 18.54Q59.16 19.47 58.65 20.00L58.62 19.97L58.65 20.00Q58.14 20.45 57.02 20.61L57.04 20.63L56.94 20.53Q56.24 20.61 55.95 20.46L55.94 20.45L55.99 20.50Q55.83 20.20 55.83 20.03L55.89 20.10L55.86 20.07Q55.67 18.24 57.24 17.55L57.32 17.63L57.36 17.67Q57.63 17.35 58.04 17.39Z\"/><path fill=\"#235059\" d=\"M16.19 22.13L16.31 22.25L16.27 22.21Q15.48 22.22 14.64 21.99L14.74 22.09L14.70 22.05Q14.05 21.56 13.97 20.68L13.96 20.67L14.02 20.74Q13.98 20.62 14.09 19.21L14.11 19.23L14.12 19.25Q14.49 18.97 15.58 18.77L15.60 18.79L15.47 19.17L15.47 19.17Q15.36 20.14 16.11 20.45L16.20 20.54L16.26 20.59Q16.67 20.75 17.79 20.75L17.79 20.76L17.72 20.68Q18.66 20.68 18.76 20.64L18.59 20.48L18.62 20.50Q19.13 20.45 19.52 20.18L19.55 20.21L19.60 20.26Q20.40 19.80 20.30 18.68L20.29 18.67L20.31 18.68Q20.08 17.26 19.16 16.42L19.20 16.47L19.27 16.54Q18.31 15.67 16.99 15.67L16.84 15.52L16.96 15.52L17.02 15.58Q17.04 15.38 17.51 15.34L17.54 15.37L17.54 15.36Q18.69 15.43 19.42 14.77L19.37 14.72L19.27 14.62Q20.03 13.98 20.11 12.98L20.27 13.14L20.13 13.00Q20.12 12.77 20.12 12.59L20.22 12.68L20.24 12.70Q20.23 11.87 19.49 11.38L19.46 11.35L19.43 11.32Q18.92 11.04 18.07 11.10L18.03 11.07L17.98 11.02Q17.35 10.99 16.69 11.22L16.70 11.22L16.59 11.11Q15.88 11.46 15.72 12.08L15.78 12.14L15.63 11.99Q15.62 12.48 15.66 12.89L15.66 12.89L15.64 12.88Q15.02 12.68 13.92 12.30L13.93 12.31L14.03 12.41Q13.90 11.50 13.92 11.05L13.88 11.02L13.92 11.05Q13.89 10.14 14.46 9.78L14.55 9.87L14.56 9.88Q15.31 9.55 16.17 9.55L16.06 9.44L16.16 9.54Q17.88 9.54 19.57 9.69L19.59 9.71L19.41 9.53Q22.20 9.83 22.04 11.85L21.99 11.80L21.96 11.77Q21.97 12.62 21.70 13.45L21.68 13.43L21.69 13.44Q21.21 15.10 19.94 15.59L20.02 15.66L20.07 15.71Q21.46 15.98 21.79 17.78L21.80 17.80L21.81 17.80Q21.76 18.24 21.80 19.32L21.95 19.47L21.82 19.34Q21.94 21.77 19.47 22.01L19.42 21.95L19.49 22.03Q19.06 22.02 16.22 22.17ZM19.15 23.50L19.14 23.50L19.00 23.35Q19.47 23.52 21.00 23.56L20.88 23.44L20.83 23.38Q21.83 23.49 22.70 23.14L22.76 23.20L22.78 23.22Q23.31 22.61 23.21 21.67L23.18 21.64L23.34 21.80Q23.13 20.93 22.97 20.00L23.09 20.12L23.03 20.06Q22.63 17.64 21.59 16.76L21.68 16.85L21.46 16.53L21.42 16.47L21.45 16.50Q22.44 15.78 22.85 13.44L22.81 13.39L22.89 13.48Q22.96 13.28 23.02 12.77L22.98 12.73L22.97 12.72Q23.06 12.36 23.02 11.99L22.90 11.88L23.02 12.00Q22.80 10.96 22.11 10.59L22.18 10.66L22.06 10.59L22.10 10.62Q21.98 10.14 21.37 9.85L21.28 9.76L21.28 9.77Q20.59 9.53 17.84 9.36L17.82 9.34L17.77 9.30Q16.81 9.19 15.95 9.19L15.91 9.15L15.98 9.22Q15.06 9.16 14.25 9.51L14.27 9.53L14.41 9.67Q13.65 9.96 13.65 10.90L13.71 10.97L13.78 11.03Q13.75 10.78 13.89 12.57L13.78 12.47L13.77 12.45Q14.09 12.65 14.97 12.98L14.87 12.88L14.85 12.86Q14.87 13.16 14.85 13.43L14.91 13.49L14.77 13.35Q14.93 13.78 14.95 14.06L14.88 13.99L14.93 14.04Q15.89 14.25 16.97 14.31L16.99 14.32L16.85 14.19Q16.83 13.13 17.42 12.68L17.52 12.78L17.54 12.79Q17.97 12.44 19.06 12.31L18.99 12.25L19.02 12.28Q19.60 12.25 19.91 12.35L19.81 12.25L19.86 12.30Q19.98 12.46 20.00 12.52L20.03 12.55L20.01 12.64L20.00 12.87L20.07 12.94Q19.94 12.91 19.92 12.99L20.02 13.09L19.99 13.06Q19.90 13.93 19.08 14.56L19.13 14.61L19.20 14.68Q18.55 15.01 17.47 15.11L17.47 15.11L17.52 15.16Q17.19 15.31 16.73 15.31L16.64 15.22L16.75 15.33Q16.71 15.46 16.79 15.82L16.78 15.81L16.77 15.80Q17.70 15.79 18.48 16.18L18.43 16.14L18.52 16.28L17.66 16.36L17.59 16.29Q17.65 16.52 17.71 16.84L17.71 16.84L17.61 16.74Q18.91 16.85 19.82 17.57L19.74 17.49L19.85 17.59Q19.88 17.71 20.04 18.58L20.02 18.56L20.13 18.67Q20.08 20.09 18.51 20.31L18.51 20.31L18.56 20.36Q17.39 20.46 17.08 20.44L17.21 20.56L17.10 20.46Q16.91 20.45 16.63 20.41L16.58 20.36L16.72 20.26L16.59 19.82L16.74 19.75L16.63 19.45L16.65 19.47Q16.26 19.63 15.83 19.73L15.76 19.66L15.78 19.68Q15.73 19.54 15.73 19.43L15.78 19.48L15.80 19.50Q15.72 19.30 15.72 19.18L15.85 19.31L15.83 19.29Q15.89 19.10 15.97 18.71L15.88 18.63L15.90 18.64Q14.93 18.79 13.93 18.97L13.99 19.03L13.87 18.91Q13.85 19.16 13.79 19.76L13.85 19.82L13.79 19.76Q13.86 20.50 13.86 20.83L13.84 20.80L13.76 20.72Q13.88 21.90 14.61 22.31L14.45 22.15L14.64 22.34Q15.43 23.55 17.96 23.45L17.95 23.44L17.96 23.45Q18.34 23.43 19.16 23.51Z\"/><path fill=\"#235059\" d=\"M37.61 16.22L37.61 16.22L37.63 16.23Q36.60 16.13 35.94 16.89L36.02 16.97L35.94 16.89Q35.30 17.68 35.20 18.70L35.22 18.71L35.17 18.67Q35.15 19.87 35.73 20.39L35.66 20.32L35.66 20.32Q36.16 20.76 37.28 20.70L37.30 20.71L37.35 20.77Q38.44 20.66 39.04 20.29L39.10 20.35L39.06 20.31Q39.62 19.68 39.62 18.84L39.73 18.94L39.71 18.93Q39.63 18.64 39.59 18.44L39.55 18.40L39.58 18.43Q39.68 17.59 39.09 16.87L39.09 16.87L39.08 16.86Q38.57 16.22 37.67 16.28ZM37.44 22.22L37.43 22.21L37.31 22.09Q35.11 22.24 34.36 21.83L34.20 21.67L34.32 21.79Q33.81 21.43 33.71 20.51L33.66 20.46L33.64 20.45Q33.53 19.99 33.55 19.60L33.53 19.58L33.56 19.61Q33.62 19.08 33.62 18.84L33.68 18.89L33.74 18.95Q33.84 17.28 33.92 16.91L34.06 17.05L34.06 17.05Q34.34 16.04 34.78 15.29L34.72 15.23L34.69 15.19Q36.13 12.85 39.31 9.45L39.28 9.42L39.29 9.43Q40.79 9.34 41.97 8.91L41.88 8.82L41.94 8.88Q38.15 12.76 36.44 15.02L36.60 15.18L36.59 15.17Q36.98 14.77 37.67 14.77L37.85 14.94L37.71 14.81Q39.45 14.77 40.26 15.81L40.25 15.80L40.28 15.82Q41.12 16.83 41.31 18.73L41.16 18.58L41.20 18.62Q41.31 19.08 41.31 19.41L41.37 19.47L41.22 19.31Q41.33 21.09 40.14 21.66L40.05 21.57L40.16 21.68Q39.39 21.89 37.31 22.09ZM38.61 23.46L38.52 23.37L38.56 23.41Q39.19 23.32 40.25 23.37L40.38 23.49L40.25 23.37Q41.14 23.42 41.98 23.03L42.13 23.18L42.15 23.20Q42.59 22.62 42.59 21.66L42.73 21.80L42.62 21.70Q42.58 21.39 42.49 20.86L42.52 20.89L42.47 20.84Q42.54 20.47 42.54 20.22L42.38 20.07L42.40 20.09Q42.01 17.64 41.15 16.62L41.08 16.55L41.12 16.59Q41.08 16.53 41.00 16.40L41.04 16.45L40.88 16.32L40.77 16.23L40.88 16.34Q40.62 16.00 40.29 15.49L40.26 15.46L40.31 15.51Q39.91 15.08 38.84 14.84L38.85 14.84L38.84 14.83Q39.44 13.92 41.03 11.94L41.00 11.91L43.31 9.13L43.36 9.18Q42.38 9.50 41.10 9.91L41.14 9.95L41.13 9.94Q41.62 9.42 42.58 8.36L42.62 8.39L42.60 8.38Q41.23 8.86 39.15 9.16L39.20 9.22L39.21 9.23Q36.19 12.43 34.60 15.08L34.66 15.14L34.54 15.02Q33.73 16.37 33.42 19.71L33.38 19.68L33.55 19.84Q33.46 20.09 33.50 20.60L33.46 20.56L33.40 20.50Q33.55 21.55 34.14 22.04L34.17 22.07L34.01 21.91Q34.37 22.15 34.35 22.17L34.30 22.13L34.25 22.07Q34.51 22.62 34.94 22.84L34.92 22.82L34.87 22.77Q35.70 23.20 36.74 23.30L36.75 23.30L36.76 23.32Q36.75 23.30 38.62 23.47ZM38.43 17.38L38.39 17.34L38.45 17.40Q38.73 17.32 39.24 17.58L39.23 17.57L39.37 17.71Q39.45 18.12 39.45 18.46L39.57 18.58L39.50 18.51Q39.54 19.45 39.03 19.98L39.11 20.06L39.15 20.10Q38.46 20.36 37.33 20.53L37.43 20.62L37.30 20.49Q36.51 20.48 36.23 20.34L36.37 20.48L36.33 20.44Q36.13 20.10 36.13 19.93L36.14 19.94L36.31 20.11Q36.18 18.35 37.75 17.66L37.61 17.51L37.75 17.66Q38.15 17.47 38.56 17.51Z\"/><path fill=\"#000000\" d=\"M75.17 22.32L75.05 22.19L75.06 22.21Q74.40 22.34 73.56 22.11L73.58 22.13L73.53 22.08Q72.90 21.61 72.82 20.74L72.73 20.65L72.74 20.66Q72.70 20.54 72.80 19.13L72.76 19.08L72.91 19.24Q73.43 19.10 74.51 18.90L74.52 18.91L74.36 19.26L74.42 19.32Q74.20 20.18 74.95 20.48L74.98 20.51L74.99 20.52Q75.41 20.70 76.53 20.70L76.47 20.64L76.50 20.67Q77.40 20.63 77.51 20.59L77.44 20.52L77.39 20.47Q77.96 20.47 78.35 20.21L78.35 20.21L78.36 20.22Q79.12 19.72 79.02 18.60L79.11 18.68L79.02 18.60Q78.93 17.30 78.00 16.47L78.05 16.51L77.89 16.35Q77.11 15.67 75.78 15.67L75.74 15.63L75.75 15.51L75.68 15.44Q75.86 15.40 76.33 15.36L76.42 15.45L76.41 15.43Q77.43 15.38 78.16 14.71L78.14 14.69L78.10 14.65Q78.98 14.13 79.06 13.13L79.07 13.14L78.98 13.05Q78.92 12.76 78.92 12.58L78.97 12.64L78.98 12.64Q79.01 11.85 78.27 11.36L78.33 11.42L78.29 11.38Q77.70 11.02 76.85 11.08L76.84 11.07L76.83 11.06Q76.17 11.01 75.52 11.24L75.34 11.07L75.51 11.24Q74.63 11.41 74.47 12.02L74.42 11.97L74.41 11.96Q74.43 12.50 74.48 12.91L74.35 12.78L74.38 12.81Q73.83 12.70 72.73 12.31L72.78 12.35L72.71 12.28Q72.70 11.50 72.72 11.05L72.76 11.10L72.63 10.97Q72.79 10.25 73.36 9.88L73.32 9.84L73.31 9.83Q74.09 9.53 74.95 9.53L74.82 9.40L74.83 9.41Q76.57 9.44 78.26 9.58L78.39 9.71L78.24 9.55Q81.06 9.89 80.90 11.91L80.78 11.79L80.95 11.96Q80.74 12.59 80.48 13.42L80.63 13.58L80.56 13.51Q79.98 15.07 78.72 15.56L78.75 15.60L78.89 15.73Q80.11 15.84 80.44 17.63L80.54 17.73L80.42 17.61Q80.58 18.26 80.62 19.34L80.68 19.40L80.72 19.44Q80.85 21.87 78.38 22.12L78.27 22.01L78.31 22.05Q77.89 22.06 75.06 22.20ZM77.95 23.51L77.79 23.34L77.85 23.41Q78.24 23.49 79.77 23.53L79.72 23.47L79.79 23.55Q80.70 23.56 81.57 23.21L81.54 23.17L81.63 23.27Q82.24 22.74 82.14 21.80L81.99 21.64L82.06 21.72Q81.92 20.92 81.75 19.99L81.89 20.12L81.91 20.14Q81.53 17.74 80.49 16.87L80.35 16.73L80.38 16.65L80.32 16.58L80.23 16.49Q81.26 15.80 81.66 13.45L81.66 13.45L81.70 13.48Q81.63 13.15 81.69 12.64L81.76 12.71L81.66 12.61Q81.79 12.30 81.75 11.93L81.79 11.97L81.65 11.83Q81.68 11.04 80.99 10.67L81.02 10.70L80.87 10.60L80.94 10.66Q80.84 10.20 80.23 9.92L80.10 9.79L80.10 9.79Q79.34 9.47 76.59 9.31L76.62 9.35L76.53 9.25Q75.57 9.15 74.71 9.15L74.78 9.22L74.85 9.29Q73.97 9.27 73.16 9.62L73.09 9.54L73.18 9.63Q72.47 9.99 72.47 10.93L72.43 10.88L72.49 10.95Q72.42 10.65 72.56 12.44L72.66 12.54L72.53 12.41Q72.71 12.47 73.58 12.79L73.70 12.91L73.73 12.94Q73.75 13.24 73.73 13.51L73.67 13.45L73.70 13.48Q73.63 13.68 73.65 13.96L73.62 13.93L73.59 13.91Q74.59 14.15 75.67 14.21L75.61 14.15L75.72 14.26Q75.68 13.18 76.27 12.73L76.18 12.64L76.20 12.66Q76.66 12.32 77.74 12.19L77.87 12.33L77.71 12.17Q78.47 12.32 78.78 12.42L78.66 12.30L78.68 12.32Q78.75 12.44 78.77 12.50L78.75 12.48L78.68 12.51L78.76 12.83L78.77 12.84Q78.78 12.95 78.76 13.03L78.87 13.15L78.71 12.98Q78.81 14.04 77.99 14.67L78.02 14.70L77.91 14.59Q77.38 15.04 76.30 15.14L76.45 15.29L76.44 15.28Q76.03 15.34 75.56 15.34L75.57 15.35L75.55 15.34Q75.61 15.55 75.69 15.92L75.56 15.79L75.71 15.94Q76.59 15.88 77.36 16.27L77.27 16.17L77.34 16.31L76.34 16.25L76.52 16.42Q76.50 16.56 76.56 16.89L76.54 16.87L76.57 16.90Q77.63 16.78 78.55 17.49L78.63 17.57L78.66 17.60Q78.76 17.79 78.92 18.66L78.89 18.63L78.79 18.53Q78.96 20.17 77.39 20.40L77.46 20.46L77.38 20.38Q76.21 20.47 75.90 20.45L76.00 20.55L75.98 20.54Q75.70 20.44 75.42 20.40L75.42 20.40L75.41 20.15L75.44 19.87L75.42 19.63L75.52 19.54L75.60 19.62Q74.94 19.51 74.51 19.61L74.60 19.70L74.53 19.63Q74.62 19.62 74.62 19.52L74.50 19.40L74.48 19.38Q74.50 19.28 74.50 19.16L74.62 19.28L74.59 19.24Q74.56 18.97 74.64 18.58L74.59 18.53L74.78 18.72Q73.71 18.77 72.71 18.96L72.76 19.00L72.77 19.01Q72.67 19.18 72.61 19.78L72.63 19.81L72.64 19.82Q72.65 20.49 72.65 20.81L72.57 20.73L72.66 20.82Q72.66 21.88 73.39 22.29L73.42 22.32L73.37 22.27Q74.10 23.43 76.63 23.33L76.58 23.27L76.73 23.42Q77.09 23.38 77.91 23.46Z\"/></svg>",
    "status": {
        "code": "E0",
        "message": "ok"
    }
}


在后置脚本中,添加脚本

 
 
let template = ` 
<h1>验证码</h1>
<img  target="_blank" src="{{data}}" rel="external nofollow" />
</body>
`
let data = response.json.data
let base64 = Buffer.from(data).toString('base64')
let imgData = 'data:image/svg+xml;charset=utf-8;base64,'+base64;
apt.Visualizing(template, { data: imgData });


然后就可以在可视化中,展示svg图片

svg如何进行可视化渲染


希望对各位有帮助!

感谢大佬反馈

Apipost 私有化火热进行中

撰写答案

只服务于

前后端、移动端、测试人员

提问题 发布您遇到的Bug和问题,上万名大牛和开发者来帮您解决!