Download as SVG not working

147 views
Skip to first unread message

권봉서

unread,
Sep 20, 2021, 12:48:51 AM9/20/21
to Paper.js
Hi. I made a website using paperJS and working well.
But a few months ago, download as SVG feature is not working suddenly.

https://automata.cafe24.com/roundgear/


And I found paperJS official website is not working too.
(2) click Download as SVG button
(3) Error: Server Error


If someone knows about this kind of problem, share your wisdom.
Thanks.



I log my source code.


$('#export-button').click(function () {
var svg = project.exportSVG({ asString: true });
downloadDataUri({
data: 'data:image/svg+xml;base64,' + btoa(svg),
filename: 'hello.svg'
});
});

function downloadDataUri(options) {
if (!options.url)
$('<form method="post" action="' + options.url
+ '" style="display:none"><input type="hidden" name="filename" value="'
+ options.filename + '"/><input type="hidden" name="data" value="'
+ options.data + '"/></form>').appendTo('body').submit().remove();
}

Mark MacKay

unread,
Oct 5, 2021, 4:54:31 PM10/5/21
to Paper.js
It seems the http://download-data-uri.appspot.com/ service is no longer working, I would suggest to use the download attribute on an anchor, like this:

권봉서

unread,
Jan 11, 2022, 8:39:03 AMJan 11
to Paper.js
Thank you for your reply.
I solved it using the method below.

(1)(rgg.js) Whenever a drawing is drawn on the canvas, input the SVG value to the hidden property input.
(2)(index.html) If you click the Download as SVG button, the input value is transferred to the php file. in the post method.
(3)(makeSvgFile.php) Write "image/svg+xml" in the source code header. The received  SVG  value is echoed in the php file to be downloaded.

### link :
https://automata.cafe24.com/roundgear

I am attaching the source code for each file for the next person.

Thank you.

---

### rgg.js

function main(){
...

var svg = project.exportSVG({ asString: true });
$('#input_svg').val(svg);
}



### index.html

<form method="post" action="makeSvgFile.php">
  <input type="hidden" id="input_svg" name="input_svg" value="">
  <button type="submit" value="Submit" class="btn btn-sm btn-primary" id="export-button">Download as SVG</button>
</form>



### makeSvgFile.php

<?
header('Content-type: image/svg+xml');
header('Content-Disposition: attachment; filename=mu_ya_ho.svg');

$data = $_POST['input_svg'];
echo $data;
?>

2021년 10월 6일 수요일 오전 5시 54분 31초 UTC+9에 Mark MacKay님이 작성:
Reply all
Reply to author
Forward
0 new messages