div에 이미지를 추가하고 jQuery를 사용하여 base64 문자열을 썸네일로 변환

debugcn 에 게시 Dev

Gihansalith

var img로 수신 된 base64 문자열입니다. 그런 다음 이미지로 변환하여 축소판으로 표시해야합니다. 내 구현은 다음과 같습니다.

var img = "base64 string";

<div id="img_preview" style="width:250px; height:250px;"></div>

다음은 문자열입니다.

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

손님 271314

편집, 업데이트

시험

var base64_string = "/9j/4AAQSkZJRgABAgAAAQABAAD//...";
var img = document.createElement("img");
// added `width` , `height` properties to `img` attributes
img.width = "250px";
img.height = "250px";
img.src = "data:image/png;base64," + base64_string;
var preview = document.getElementById("img_preview");
preview.appendChild(img);

Node.js (jquery 라이브러리)

$("<img>", {
  "src": "data:image/png;base64," + base64_string,
  // added `width` , `height` properties to `img` attributes
  "width": "250px", "height": "250px"})
.appendTo("#img_preview");

var base64_string = "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";
























































    $("<img>", {
      "src": "data:image/png;base64," + base64_string,
      "width": "250px", "height": "250px"})
    .appendTo("#img_preview");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="img_preview" style="width:250px; height:250px;"></div>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정2021-06-1

몇 마디 만하겠습니다

0리뷰

로그인참여 후 검토

Related 관련 기사

기사

div에 이미지를 추가하고 jQuery를 사용하여 base64 문자열을 썸네일로 변환

div에 이미지를 추가하고 jQuery를 사용하여 base64 문자열을 썸네일로 변환

파일에서 이미지를 Base64 문자열로 변환하는 방법은 무엇입니까?

fabricjs에 포함 된 이미지 base64를 사용하여 캔버스를 SVG로 변환하는 방법

Gridfs를 사용하여 base64 문자열 이미지를 MongoDB에 저장

Postgres bytea를 base64 문자열로 변환하는 방법

신속하게 UIImage를 base64 문자열로 변환

XSLT 1을 사용하여 XML 문서를 base64로 변환

썸네일을 사용하여 Mp4를 Mp3로 변환

emailComposer 플러그인을 사용하여 pdf를 base64 문자열로 이메일에 첨부하는 ngCordova

갤러리에서 이미지를 가져와 base64 문제로 변환

미리로드 된 이미지를 jQuery에서 base64 데이터로 변환하는 방법

미리로드 된 이미지를 jQuery에서 base64 데이터로 변환하는 방법

Android에서 이미지 개체를 Base64 문자열로 변환

Boto3를 사용하여 Python의 S3 서버에 base64 문자열 (이미지 데이터)을 업로드하고 반환 URL 가져 오기

React를 사용하여 바이너리 스트림을 BASE64로 변환

Google App Engine : OCR 용 이미지를 base64 문자열로 변환 (Python)

URL에서 추출한 이미지를 base64로 변환

URL에서 이미지를 가져 와서 base64 문자열로 변환-Flutter

C에서 이미지를 base64로 변환하는 방법?

AngularJS에서 base64 데이터를 포함하는 변수를 사용하여 이미지 src로드

Mule 4에서 Dataweave를 사용하여 base64를 byte []로 변환

Kotlin Android에서 base64 문자열을 이미지로 변환하는 방법

Qt에서 Jpeg Base64 문자열을 jpeg 이미지로 변환하는 방법

base64 이미지를 UploadedFile로 변환하는 방법 Laravel

이미지를 base64로 변환하는 방법

여러 이미지를 업로드하고 cakephp의 썸네일로 변환

Base64 이미지 문자열을 파일로 다시 변환하여 Parse 업로드로 보냅니다.

Java에서 Base64를 이진 문자열로 변환

Java에서 Base64를 이진 문자열로 변환

Spring을 사용하여 인코딩 된 base64 이미지를 서버에 업로드하는 방법