Блог

Я разрабатываю сайт, который закодирован с помощью React Native. Я решил использовать некоторые шрифты Google, поскольку их легко реализовать. Все работало нормально, пока я не начал использовать Traefik в качестве обратного прокси для своего сайта, и я решил сделать его безопасным с помощью https. Единственная проблема заключается в том, что теперь при загрузке он выдает 15 предупреждений о смешанном содержимом над небезопасными шрифтами.

Вот как я загружаю шрифты в свое приложение…

 import {
    useFonts,
    Pacifico_400Regular,
    ComicNeue_400Regular,
    JosefinSans_400Regular,
    BalsamiqSans_400Regular,
    Inconsolata_400Regular,
} from '@expo-google-fonts/dev';
import { AppLoading } from 'expo';

function BodyText(props) {
    let [fontsLoaded] = useFonts({
        Pacifico_400Regular,
        ComicNeue_400Regular,
        JosefinSans_400Regular,
        BalsamiqSans_400Regular,
        Inconsolata_400Regular,
    });
 

Это ошибка, которую я получаю…

Смешанный контент: страница » была загружена по протоколу HTTPS, но запрашивала небезопасный шрифт «. Этот запрос заблокирован; содержимое должно передаваться по протоколу HTTPS.

Я не уверен, как исправить эту проблему, поскольку нет неявной ссылки на http, которую я мог бы изменить на https.

Редактировать:

Проблема решена благодаря Эмануэле Скарабаттоли

Я изменил приведенный выше код на

 import { useFonts, Pacifico_400Regular } from '@expo-google-fonts/pacifico';
import { ComicNeue_400Regular } from '@expo-google-fonts/comic-neue';
import { JosefinSans_400Regular } from '@expo-google-fonts/josefin-sans';
import { BalsamiqSans_400Regular } from '@expo-google-fonts/balsamiq-sans';
import { Inconsolata_400Regular } from '@expo-google-fonts/inconsolata';
 

Это производственный импорт.
Большое спасибо за помощь!

Проблема, по-видимому, связана с самим @expo-google-fonts/dev пакетом, в частности с этим файлом:

https://github.com/expo/google-fonts/blob/master/font-packages/dev/index.js

Как вы можете видеть , все шрифты загружаются в HTTP , а не в HTTPS .

Вам следует подумать о том, чтобы использовать use @expo-google-fonts/inter вместо:

https://github.com/expo/google-fonts#usage

Или подумайте о том, чтобы взглянуть здесь:

https://docs.expo.io/guides/using-custom-fonts/