window.URL 객체 사용 소개(예제 포함)

이 글은 window.URL 객체의 사용법을 소개합니다(예제 포함). 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1 window.URL이란 무엇입니까?

창 개체의 URL 개체는 특히 Blob이나 파일을 URL로 읽는 데 사용됩니다.

window.URL.createObjectURL(file / blob)

이 URL은 img의 src, 오디오/비디오의 src 및 소스 태그 등 URL을 사용할 수 있는 HTML의 어느 곳에서나 사용할 수 있습니다.
브라우저에 표시될 수 있는 모든 사진, 오디오, 비디오 등은 url을 사용하여 URL 개체로 변환될 수 있습니다. 이 개체는 src에서 참조되면 표시됩니다.

그러면 이 파일이나 blob은 어디서 오는 걸까요? 로컬 하드 디스크에서 을 통해 선택된 파일일 수도 있고, Ajax 요청을 통해 알 수 없는 서버에서 메모리로 요청할 수도 있습니다.

질문: img 태그의 src 속성이 엑셀 파일에서 변환된 url 객체인 경우 어떻게 되나요?

img 태그가 파일 유형을 감지하기 때문에 img는 확실히 읽을 수 없을 것 같습니다.

2. URL 생성자는 일반 URL을 URL 개체로 변환합니다.

파일이나 blob을 Url 개체로 변환하는 것 외에도 URL 문자열을 URL 개체로 변환할 수도 있습니다.

// https://cn.bing.com?id=123
var parsedUrl = new URL('https://cn.bing.com?id=123v');
console.log('parsedUrl' , parsedUrl, parsedUrl.searchParams.get("id")); // 123
console.log('parsedUrl' , parsedUrl.toString(), parsedUrl.searchParams.set("name" , 'alexandra')); // https://cn.bing.com/?id=123v&name=alexandra

searchParams 속성은 URLSearchParams를 반환합니다. object

var urlSearchParams = URL.searchParams;

3. URL 인스턴스 개체의 toString() 메서드

URL의 toString() 메서드는 URL을 URL로 변환할 수 있습니다. 문자열 및:

URL.toString() === URL.href

// http://www.example.com/démonstration.html
let url = new URL('http://www.example.com/démonstration.html')
let test = url.toString() === url.href;
console.log('url.href', url.href, 'url.toString()' , url.toString() , 'test' , test);
// url.href http://www.example.com/d%C3%A9monstration.html url.toString() http://www.example.com/d%C3%A9monstration.html test true

https://developer.mozilla.org...

4.URL 객체 정적 메소드 createObjectURL(object)

URL.createObjectURL(object)은 URL 객체의 정적 메소드로, URL 객체를 생성하는 데 사용됩니다. DOMString(UTF-16 문자열)은 실제로 전달된 매개변수 객체를 가리키는 참조 경로 URL 문자열을 메모리에 반환합니다.
현재 페이지의 문서가 삭제되면 생성된 URL 문자열이 유효하지 않게 됩니다.

objectURL = URL.createObjectURL(object);

object
A File, Blob or MediaSource object to create an object URL for.

return
A DOMString containing an object URL that can be used to reference the contents of the specified source object.

https://developer.mozilla.org...

5.URL 객체 정적 메소드 revokeObjectURL(objectURL)

URL 객체의 정적 메소드 revokeObjectURL()은 URL.createObjectURL(object)을 통해 생성하는 데 사용됩니다. ) 파괴 URL 전의 방법.
이 메소드가 호출되면 이전에 생성된 URL을 저장하지 않도록 브라우저에 지시합니다. revokeObjectURL(objectURL) 이후 해당 URL을 다시 사용하면 해당 URL이 소멸되어 사용할 수 없기 때문에 오류가 발생합니다.

rreee

위 내용은 window.URL 객체 사용 소개(예제 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!