최근 프로젝트에서 사진 다운로드 기능이 필요합니다 (아래 그림과 같이)
처음에는 A 태그의 다운로드 속성을 사용하여 다운로드 할 수 있습니다.
<a href = 그림 SRC 다운로드 = 다운로드 포스터> 다운로드 포스터 </a>
그러나 테스트 후 Safari에서 다운로드 된 파일을 확장 이름으로 가져올 수 없으므로 마음을 바꾸고 처리를 위해 캔버스를 사용해야합니다.
1. 이미지를 설정하려면 Crossorigin = '익명'을 추가해야합니다.
img.crossorigin = '익명';
2. Todataurl을 사용하여 그림을 Base64 형식으로 변환합니다.
canvas.todataurl (image/png)
3. 아날로그 클릭 이벤트를 사용하여 다운로드를 트리거합니다
var save_link.href = 'a'); ;
전체 코드 :
var 캔버스 = $ ( '. 캔버스'); function () {var _w. naturalwidth; '); Save_Link.href ='test .png '; .src = 'http://n.sinaimg.cn/transform/20170825/nzi3- fykiu fe6650492.jpg';}
위는이 기사의 모든 내용입니다.