路线:
Route::get('/generated',[QRCodeController::class,'generate'])->name('qr.generateqrCode');
在控制器中:
public function generate(Request $request){
$data = $request->input('data');
$size = $request->input('size');
$qrcode = QrCode::size($size)->generate($data);
// Convert the QR code image to base64 for embedding in HTML
$qrcodeBase64 = base64_encode($qrcode);
// Pass the base64-encoded QR code image to the view
return view('welcome', ['qrcode' => $qrcodeBase64]);
}
视图中:
<div class="body-simpleQR">
<form action="{{ route('qr.generateqrCode') }}">
<label for="textbox1">Link:</label>
<input class="dataentry_bar" type="text" name="data" id="textbox1" placeholder="Enter link...">
<div class="size-container">
<label for="textbox2">Size:</label>
<input class="sizeentry_bar" type="text" name="size" id="textbox2" placeholder="Enter size..."> px
</div>
<div class="button-container">
<button class="createQR" type="submit" name="myButton">Generate QR code(s)</button>
</div>
</form>
</div>
<div class="generatedQrcodeDisplay">
<!-- This is where the generated QR code image will be displayed -->
@if(isset($qrcode))
<img src="data:image/png;base64,{{ $qrcode }}" alt="QR Code">
@endif
</div>
二维码生成成功(我解码了它并查看了它的svg),但只显示了损坏的图像图标。
我该如何解决这个问题?
我不知道该怎么做,因为在我看来它应该工作得很好
正如评论中提到的,这是一个 svg 文件。
数据类型必须是:data:image/svg+xml;
我发现 embed 标签在这种情况下效果更好:
<embed src="data:image/svg+xml;base64,{{ $qrcode }}
>
知道您不需要对 svg 文件进行 Base64 编码也很高兴。所以你也可以将原始输出放入其中。它更具可读性。
更多信息可以在这个答案中找到: Base64 / SVG HTML 图像未显示