рдореИрдВ рдПрдХ рд╡рд┐рд╢рд┐рд╖реНрдЯ рд╡рд╛рддрд╛рд╡рд░рдг (рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди) рдореЗрдВ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдкреАрдбреАрдПрдл рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рдлрд╝рд╛рдЗрд▓ рдХреЛ http/https рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рд▓реЗрдХрд┐рди fs рд╕реЗ рд▓реЛрдб рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ред
рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ onLoadSuccess рдХреЛ рдирд┐рдХрд╛рд▓ рдирд╣реАрдВ рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ, рдХреНрдпрд╛ рдпрд╣ рд╕рд╛рдорд╛рдиреНрдп рд╣реИ?
рдореБрдЭреЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреЛ рдкреНрд░рд╕реНрддреБрдд рдХрд░рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред
рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рд╕рд╛рдорд╛рдиреНрдп рдирд╣реАрдВ! рдХреНрдпрд╛ рдлрд╝рд╛рдЗрд▓ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдЕрдиреНрдпрдерд╛ рд▓реЛрдб рд╣реЛрддреА рд╣реИ? рдХреНрдпрд╛ рдЖрдк рдпрд╣рд╛рдВ рд░рд┐рдПрдХреНрдЯ-рдкреАрдбреАрдПрдл рдХреЗ рдЕрдкрдиреЗ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЛ рд╕рд╛рдЭрд╛ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ?
рд╣рд╛рдБ, рдлрд╝рд╛рдЗрд▓ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рднрд░реА рд╣реБрдИ рд╣реИред
рд╕реНрдерд┐рд░ рд░рд┐рд▓реАрдЬ рдФрд░ 3 рдЕрд▓реНрдлрд╛ рдкрд░ рдХреЛрд╢рд┐рд╢ рдХреАред
рдХреНрдпрд╛ рдореБрдЭреЗ рдХреБрдЫ рдпрд╛рдж рдЖрдпрд╛?
export default class PDFPlayer extends PureComponent {
state = {
fileLoaded: 0,
numPages: null,
pageNumber: 1,
}
componentWillMount() {
const { filePath } = this.props;
if (fs.existsSync(filePath)) {
fs.readFile(filePath, (err, file) => {
if (err) { console.log(err); }
this.file = new Uint8Array(file);
this.setState({ fileLoaded: 1 });
});
}
}
onLoadSuccess = (pdf) => {
console.log('onDocumentLoad', pdf);
this.setState({ numPages: pdf.numPages });
}
onRenderSuccess = (page) => {
console.log(page.originalHeight);
}
render() {
const { fileLoaded } = this.state;
if (!fileLoaded) return null;
return (
<div style={{ ...styles.container, height: document.body.offsetHeight }}>
<Document
ref={(doc) => { this.document = doc; }}
file={{ data: this.file }}
onLoadSuccess={this.onLoadSuccess}
>
<Page onRenderSuccess={this.onRenderSuccess} pageNumber={1} />
</Document>
</div>
);
}
}
рдпрд╣ рдмрд┐рд▓реНрдХреБрд▓ рдареАрдХ рд▓рдЧ рд░рд╣рд╛ рд╣реИ! рдЖрд╢реНрдЪрд░реНрдп рд╣реИ рдХрд┐ рдХреНрдпрд╛ рдЖрдкрдХреЛ рдХрдо рд╕реЗ рдХрдо onSourceSuccess рдХреЙрд▓рдмреИрдХ рдорд┐рд▓рддрд╛ рд╣реИ ...!
рд╡реИрд╕реЗ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреЛ рдЗрддрдирд╛ рдХрд╛рдо рдХрд░рдиреЗ рдХреА рдЬрд░реВрд░рдд рдирд╣реАрдВ рд╣реИред
fs.readFile
рдорд┐рд▓реЗрдЧрд╛ рд╡рд╣ рднреА рд╕реНрд╡реАрдХрд╛рд░ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛редfile={this.file}
рднреА рдареАрдХ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПредрдЗрд╕рдХреЗ рдЕрд▓рд╛рд╡рд╛ рдПрдХ рд╕рдВрдХреЗрдд, рдХрдВрдкреЛрдиреЗрдВрдЯрд╡рд┐рд▓рдорд╛рдЙрдВрдЯ рдЬрд▓реНрдж рд╣реА рдмрд╣рд┐рд╖реНрдХреГрдд рд╣реЛ рдЬрд╛рддрд╛ рд╣реИ, рдХрдВрдкреЛрдиреЗрдВрдЯрдбрд┐рдбрдорд╛рдЙрдВрдЯ рдкрд░ рдПрдХ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рд▓реЛрдб рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ :)
рд╕рдВрдХреЗрдд рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж, рдореИрдВ componentDidMount
рдмрджрд▓ рдЧрдпрд╛ рд╣реВрдВ
Uint8Array
рдмрд┐рдирд╛ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИрдореБрдЭреЗ рдПрдХ рд╣реИрдХ рдорд┐рд▓рд╛ рд╣реИ, рдореБрдЭреЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреЛ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рдмрд╛рдж рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдЬрд╛рдирдиреЗ рдХреА рдЬрд░реВрд░рдд рд╣реИ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рд╕реНрдерд┐рддрд┐ рдореЗрдВ рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреА рд░реЗрдВрдбрд░рд╕рдХреНрд╕реЗрд╕ рдХреА рдкреНрд░рддреАрдХреНрд╖рд╛ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдореИрдВ рдЕрдкрдиреЗ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдореЗрдВ рдереЛрдбрд╝рд╛ рд╡реНрдпрд╕реНрдд рд╣реВрдВ рдЗрд╕рд▓рд┐рдП рдореБрдЭреЗ рдЗрд╕реЗ рдбреАрдмрдЧ рдХрд░рдиреЗ рдХрд╛ рд╕рдордп рдирд╣реАрдВ рдорд┐рд▓рд╛ред рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдпрд╣ рдЗрд╕рд▓рд┐рдП рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдкрд░ рдЪрд▓ рд░рд╣рд╛ рд╣реВрдВ рдпрд╛ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рдПрдХ рд╕реНрдерд╛рдиреАрдп рдлрд╛рдЗрд▓ рд▓реЛрдб рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рд╡реИрд╕реЗ рднреА, рдЬрдм рдореБрдЭреЗ рдЗрд╕реЗ рдбреАрдмрдЧ рдХрд░рдиреЗ рдХрд╛ рд╕рдордп рдорд┐рд▓реЗрдЧрд╛ рддреЛ рдореИрдВ рдЖрдкрдХреЛ рдЕрдкрдбреЗрдЯ рд░рдЦреВрдВрдЧрд╛ред