OS:
Linux
React-pdf version:
"@react-pdf/renderer": "1.0.0-alpha.18"
Description:
I have a problem with load custom font.
In docs we can read "Specifies the source of the font. This can either be a valid URL, or an absolute path if you're using react-pdf on Node."
So in first approach i tried include font from google font
https://fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu72xKOzY.woff2
but this format is not support.
So in second approach I tried upload Roboto font in tff format to my private hosting but in DEMO code there was some message about mix content http/https .. so I upload font into github which has https protocol.
Also I tried served locally font in my react app but there is message error:
" No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3005' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled."
I built local server for serving font with enabled cors but it doesn't work
I provide react demo where I tried generate pdf with some custom pdf.
https://codesandbox.io/s/5k72n7zq2n
I think there is a problem with fetch method. Exactly in file react-pdf.browser.es.js with
fetchFont method
var fetchFont = function fetchFont(src) {
return fetch(src).then(function (response) {
if (response.buffer) {
return response.buffer();
}
return response.arrayBuffer();
}).then(function (arrayBuffer) {
return Buffer.from(arrayBuffer);
});
};
I think that fetch method should include some headers and cors mode for fetching successfully any resources
So the final questions is:
How do I use some custom font ?
OS:
Linux
React-pdf version:
"@react-pdf/renderer": "1.0.0-alpha.18"
Description:
I have a problem with load custom font.
In docs we can read "Specifies the source of the font. This can either be a valid URL, or an absolute path if you're using react-pdf on Node."
So in first approach i tried include font from google font
https://fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu72xKOzY.woff2
but this format is not support.
So in second approach I tried upload Roboto font in tff format to my private hosting but in DEMO code there was some message about mix content http/https .. so I upload font into github which has https protocol.
Also I tried served locally font in my react app but there is message error:
" No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3005' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled."
I built local server for serving font with enabled cors but it doesn't work
I provide react demo where I tried generate pdf with some custom pdf.
https://codesandbox.io/s/5k72n7zq2n
I think there is a problem with fetch method. Exactly in file react-pdf.browser.es.js with
fetchFont method
var fetchFont = function fetchFont(src) {
return fetch(src).then(function (response) {
if (response.buffer) {
return response.buffer();
}
return response.arrayBuffer();
}).then(function (arrayBuffer) {
return Buffer.from(arrayBuffer);
});
};
I think that fetch method should include some headers and cors mode for fetching successfully any resources
So the final questions is:
How do I use some custom font ?