我正在开发一个项目,我想生成一个二维码,所以我使用了这个Lib来用JS生成它。它有效,但我想将二维码保存在服务器上。我不想在客户端下载它。
我不想在我的项目中使用 NodeJs。
我尝试了很多方法,例如将 SVG 标签数据发送到 PHP 并生成图像,但它对我不起作用。
这是我的文件:
索引.php
<?php
// https://github.com/oblakstudio/qr-code-styling?
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>QR Code Styling</title>
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script type="text/javascript" src="node_modules/qr-code-styling/lib/qr-code-styling.js"></script>
</head>
<body>
<div id="canvas"></div>
<script>
const qrCode = new QRCodeStyling({
width: 300,
height: 300,
type: "svg",
data: "https://www.facebook.com/",
image: "test.png",
margin:0,
qrOptions:{
typeNumber:0,
errorCorrectionLevel:'H'
},
dotsOptions: {
color: "#00437A",
type: "classy",
},
cornersSquareOptions:{
color:'#1a79a5',
type:'rounded',
},
cornersDotOptions:{
color:'#1a79a5',
type:'dot',
},
backgroundOptions: {
color: "#fff",
},
imageOptions: {
crossOrigin: "anonymous",
margin: 0
}
});
qrCode.append(document.getElementById("canvas"));
const svg = document.querySelector('svg');
$.ajax('ajax.php',{
'data': svg.outerHTML,
'type': 'POST',
'processData': false,
'contentType': 'image/svg+xml'
});
</script>
</body>
</html>
ajax.php
<?php
$svg = file_get_contents('php://input');
$myfile = fopen("testfile.svg", "w");
fwrite($myfile, $svg);
?>
使用此代码
var svgBlob = qrCode.getRawData('svg');
svgBlob.then(value => value.text().then(value => sendAjax(value)));
function sendAjax(svgString) {
$.ajax('ajax.php',{
'data': svgString, //canvas.innerHTML,
'type': 'POST',
'processData': false,
'contentType': 'image/svg+xml'
});
}
你能帮我得到同样的PNG格式吗?我尝试将 SVG 更改为 PNG 或 JPEG,但它显示格式错误。我使用完全相同的代码,但只需更改扩展名。请帮忙,我需要将二维码保存为 PNG 或 JPEG 格式。