How to use the @wordpress/blob.getBlobByURL function in @wordpress/blob
To help you get started, we’ve selected a few @wordpress/blob examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
WordPress / gutenberg / packages / block-library / src / file / edit.js View on Github 
componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
setAttributes,
} = this.props;
const { downloadButtonText, href } = attributes;
// Upload a file drag-and-dropped into the editor
if ( isBlobURL( href ) ) {
const file = getBlobByURL( href );
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ media ] ) => this.onSelectFile( media ),
onError: ( message ) => {
this.setState( { hasError: true } );
noticeOperations.createErrorNotice( message );
},
} );
revokeBlobURL( href );
}
if ( downloadButtonText === undefined ) {
setAttributes( {
downloadButtonText: _x( 'Download', 'button label' ),componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
setAttributes,
} = this.props;
const { downloadButtonText, href } = attributes;
// Upload a file drag-and-dropped into the editor
if ( isBlobURL( href ) ) {
const file = getBlobByURL( href );
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ media ] ) => this.onSelectFile( media ),
onError: ( message ) => {
this.setState( { hasError: true } );
noticeOperations.createErrorNotice( message );
},
} );
revokeBlobURL( href );
}
if ( downloadButtonText === undefined ) {
setAttributes( {
downloadButtonText: _x( 'Download', 'button label' ),componentDidMount () {
const { attributes, setAttributes } = this.props;
const { id, url = '' } = attributes;
if (isTemporaryImage(id, url)) {
const file = getBlobByURL(url);
if (file) {
mediaUpload({
filesList: [ file ],
onFileChange: ([ image ]) => {
setAttributes(pickRelevantMediaFiles(image));
},
allowedTypes: ALLOWED_MEDIA_TYPES,
});
}
}
}componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
setAttributes,
} = this.props;
const { id, src = '' } = attributes;
if ( ! id && isBlobURL( src ) ) {
const file = getBlobByURL( src );
if ( file ) {
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ { id: mediaId, url } ] ) => {
setAttributes( { id: mediaId, src: url } );
},
onError: ( e ) => {
setAttributes( { src: undefined, id: undefined } );
this.setState( { editing: true } );
noticeOperations.createErrorNotice( e );
},
allowedTypes: ALLOWED_MEDIA_TYPES,
} );
}
}componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
} = this.props;
const { id, url = '' } = attributes;
if ( isTemporaryImage( id, url ) ) {
const file = getBlobByURL( url );
if ( file ) {
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ image ] ) => {
this.onSelectImage( image );
},
allowedTypes: ALLOWED_MEDIA_TYPES,
onError: ( message ) => {
noticeOperations.createErrorNotice( message );
this.setState( { isEditing: true } );
},
} );
}
}
} const filesList = map( images, ( { url } ) => getBlobByURL( url ) );
forEach( images, ( { url } ) => revokeBlobURL( url ) );useEffect( () => {
if ( ! id && isBlobURL( src ) ) {
const file = getBlobByURL( src );
if ( file ) {
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ { id: mediaId, url } ] ) => {
setDuration( null );
setVideoSize( null );
setAttributes( { id: mediaId, src: url } );
},
onError: ( message ) => {
setIsEditing( true );
noticeOperations.createErrorNotice( message );
},
allowedTypes: allowedVideoMimeTypes,
} );
}
}componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
} = this.props;
const { id, url = '' } = attributes;
if ( isTemporaryImage( id, url ) ) {
const file = getBlobByURL( url );
if ( file ) {
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ image ] ) => {
this.onSelectImage( image );
},
allowedTypes: ALLOWED_MEDIA_TYPES,
onError: ( message ) => {
noticeOperations.createErrorNotice( message );
this.setState( { isEditing: true } );
},
} );
}
}
}componentDidMount() {
const {
attributes,
mediaUpload,
noticeOperations,
setAttributes,
} = this.props;
const { id, src = '' } = attributes;
if ( ! id && isBlobURL( src ) ) {
const file = getBlobByURL( src );
if ( file ) {
mediaUpload( {
filesList: [ file ],
onFileChange: ( [ { url } ] ) => {
setAttributes( { src: url } );
},
onError: ( message ) => {
this.setState( { editing: true } );
noticeOperations.createErrorNotice( message );
},
allowedTypes: ALLOWED_MEDIA_TYPES,
} );
}
}
} const filesList = map( images, ( { url } ) => getBlobByURL( url ) );
forEach( images, ( { url } ) => revokeBlobURL( url ) );
