[英]upload svg and png file using jquery ajax
Hello Everyone I want to upload svg it works fine but at a time i convert this svg to png using canvas and then i want to upload both file svg and png. 大家好,我想上传svg效果很好,但是一次我使用画布将这个svg转换为png,然后我想同时上传svg和png文件。 i try a lot but not get any idea.
我尝试了很多但是没有任何想法。
my code to convert svg to png 我的代码将svg转换为png
var oFReader = new FileReader();
if(file.type.match(/image\/*/)){
oFReader.onloadend = function() {
console.log(oFReader)
var blob = new Blob([this.result], {type: file.type});
var url = URL.createObjectURL(blob);
var image = new Image;
image.src = url;
image.onload = function() {
var canvas = document.querySelector("canvas");
canvas.width = image.width;
canvas.height = image.height;
var context = canvas.getContext("2d");
context.drawImage(image, 0, 0);
var a = document.createElement("a");
a.download = "image.png";
a.href = canvas.toDataURL("image/png");
and code for upload using jquery Ajax 和使用jQuery Ajax上传的代码
$.ajax({
type: 'POST',
url: 'http://localhost/uploadTest/uploa.php',
data: { svg : $("#myfile").val() , png : pngfile_path},
cache: false,
crossDomain : true,
contentType: false,
processData: false,
success: function(){
console.log("done")
}
}).done(function(dat) {
console.log(dat);
})
and php file 和PHP文件
//upload.php
header('Access-Control-Allow-Origin: *');
$output_dir = 'upload/';
echo $_POST["svg"] . "svg---";
echo $_POST["png"] . "png-**";
if ( !file_exists($output_dir) ) {
mkdir ($output_dir, 0777);
}
if(isset($_POST["svg"]))
{
//Filter the file types , if you want.
if ($_POST["svg"]["error"] > 0)
{
echo "Error: " . $_POST["svg"]["error"] . "<br>";
}
else
{
//move the uploaded file to uploads folder;
move_uploaded_file($_POST["svg"]["tmp_name"],$output_dir. $_POST["svg"]["name"]);
echo $_POST["svg"]["name"];
exit;
}
}
?>
i want to upload both file svg and php.. thanks in andvence 我想同时上传文件svg和php ..在Andvence中感谢
Use this tutorial for file upload logic you have to use $_FILES array not $_POST 使用本教程进行文件上传逻辑,您必须使用$ _FILES数组而不是$ _POST
http://blog.trofeosolution.com/index.php/blog/file-upload http://blog.trofeosolution.com/index.php/blog/file-upload
If you post file content then your server script should be like this 如果发布文件内容,则服务器脚本应如下所示
if ( !file_exists($output_dir) ) {
mkdir ($output_dir, 0777);
}
if(isset($_POST["svg"]))
{
$svg = $_POST["svg"];
//Filter the file types , if you want.
if (!empty($svg))
{
file_put_contents('abc.svg', $svg);
}else{
echo "Error: SVG POST fails<br>";
}
else
{
echo 'POST failed';
exit;
}
I achieved this not too long ago by sending base64 encoded image to the php server inside some json, then decoding it and writing a file. 我不久前通过将base64编码的图像发送到json中的php服务器,然后对其进行解码并编写一个文件来实现这一点。 Decoding on the server allowed me to check for validity etc. and return updated base64 encoded data inside a json response.
服务器上的解码使我可以检查有效性等,并在json响应中返回更新的base64编码数据。
See this answer, it might help: Getting binary (base64) data from HTML5 Canvas (readAsBinaryString) 看到这个答案,可能会有所帮助: 从HTML5 Canvas(readAsBinaryString)获取二进制(base64)数据
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.