• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Fontello nie wyświetla się w Firefoxie. Konsola wyrzuca błąd CORS...Pomocy

Cloud VPS
0 głosów
840 wizyt
pytanie zadane 13 lipca 2019 w HTML i CSS przez wojbuk1985 Nowicjusz (160 p.)
Witam... Mam problem z fontello chodzi dokładnie o to że po załadowaniu strony na IE i Operze wszystko działa tak jak należy. Natomiast na Mozilla Firefox nie działa i konsola wyrzuca mi błąd typu:

Zablokowano żądanie do zasobu innego pochodzenia: zasady „Same Origin Policy” nie pozwalają wczytywać zdalnych zasobów z „file:///C:/Users/Wojtek/Desktop/projekt/font/fontello.woff?49170314” (żądanie CORS inne niż HTTP).

Ikonki fontello się nie wyświetlają. Jak mam to naprawić obejść czy cokolwiek mam z tym zrobić pomóżcie mi jestem początkujący nie mam pojęcia jak to obejść:( pomocy
komentarz 13 lipca 2019 przez thryndl Nałogowiec (30,470 p.)
Pokaż kod, gdzie ładujesz fontello.
komentarz 13 lipca 2019 przez wojbuk1985 Nowicjusz (160 p.)
<!DOCTYPE html>

<html lang="pl">
<head>
	<meta charset="utf-8">
	<meta name="description" content="Blog na temat ciekawych publikacji z dziedziny filozofii, omówienie wybranych tekstów najsłynniejszych autorów!">
	<meta name="keywords" content="filozofia, blok, książki, przemyślenia">
	<meta name="author" content="Wojciech Bukowski">
	<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
	<title>Philosophia Blog</title>
	<link rel="stylesheet" href="style.css" >
	<link rel="stylesheet" href="css/fontello.css" >
	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap" > 
	<!--[if lt IE 9]>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
	<![endif]-->
</head>
<body>
	<header>
		<h1 class="logo">Philosophia Blog</h1>
		<nav>
			<ul class="menu">
				<li><a href="#">Strona Główna</a></li>
				<li><a href="#">Pierwszy raz tutaj?</a></li>
				<li><a href="#">Dlaczego filozofia</a></li>
				<li><a href="#">O autorze</a></li>
				<li><a href="#">Kontakt</a></li>
			</ul>
		</nav>
	</header>
	<main>
		<article>
			<section>
				<div class="categories">
					<header>
						<h1>Witaj w świecie filozofii!</h1>
						<p> Czy jesteś fanem filozofii? Lubisz świat idei? Ciekawią Cię sposoby interpretowania świata przez ludzi? Jeśli tak, to zapraszam do przygotowanych przeze mnie artukułów inspirowanych publikacjami znanych filozofów. </p>
					</header>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/alan-watts.jpg" alt="Alan Watts"></a>
						</figure>
						<figcaption>Alan Watts</figcaption>
					</div>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/de-mello.jpg" alt="De Mello"></a>
						</figure>
						<figcaption>De Mello</figcaption>
					</div>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/emerson.jpg" alt="Emerson"></a>
						</figure>
						<figcaption>Emerson</figcaption>
					</div>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/kant.jpg" alt="Emanuel Kant"></a>
						</figure>
						<figcaption>Emanuel Kant</figcaption>
					</div>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/nietzsche.jpg" alt="Nietzsche"></a>
						</figure>
						<figcaption>Nietzsche</figcaption>
					</div>
					<div class="authors">
						<figure>
							<a href="#"><img src="img/platon.jpg" alt="Platon"></a>
						</figure>
						<figcaption>Platon</figcaption>
					</div>
				</div>
			</section>
			<section id="newest">
				<div class="entries">
					<header>
						<h1>Najnowsze wpisy</h1>
						<p> Poniżej znajdziesz trzy ostatnio opublikowane artykuły- dzięki temu można sprawdzić, czy na blogu pojawiło się coś nowego. Wpisy zazwyczaj pojawiają się we wtorki i piątki, o nowościach informują także na swoim Twitterze.</p>
					</header>
					<div class="entry">
						<div class="entryimg">
							<img src="img/alan-watts.jpg" alt="Alan Watts">
						</div>
						<div class="entrytxt">
							<h2>Antony de Mello: Poszukiwanie akceptacji</h2>
							<p>Ktoś kiedyś pięknie to ujął: życie to coś, co przydarza się nam podczas gdy jesteśmy zajęci układaniem planów. Jesteśmy zajęci imponowaniem wszystim wokół, dbaniem o to, by na pewno zostać dobrze odebranym. Porozmawiajmy o nałogu poszukiwania akceptacji</p>
						</div>
					</div>
					<div class="entry">
						<div class="entryimg">
							<img src="img/alan-watts.jpg" alt="Alan Watts">
						</div>
						<div class="entrytxt">
							<h2>Antony de Mello: Poszukiwanie akceptacji</h2>
							<p>Ktoś kiedyś pięknie to ujął: życie to coś, co przydarza się nam podczas gdy jesteśmy zajęci układaniem planów. Jesteśmy zajęci imponowaniem wszystim wokół, dbaniem o to, by na pewno zostać dobrze odebranym. Porozmawiajmy o nałogu poszukiwania akceptacji</p>
						</div>
					</div>
					<div class="entry">
						<div class="entryimg">
							<img src="img/alan-watts.jpg" alt="Alan Watts">
						</div>
						<div class="entrytxt">
							<h2>Antony de Mello: Poszukiwanie akceptacji</h2>
							<p>Ktoś kiedyś pięknie to ujął: życie to coś, co przydarza się nam podczas gdy jesteśmy zajęci układaniem planów. Jesteśmy zajęci imponowaniem wszystim wokół, dbaniem o to, by na pewno zostać dobrze odebranym. Porozmawiajmy o nałogu poszukiwania akceptacji</p>
						</div>
					</div>
				</div>
			</section>
			<section>
			
					<div class="contact">
						<header>
							<h1>Kontakt z autorem</h1>
							<p> Jeśli masz ochotę podyskutować, zaproponować temat wpisu lub nawiązać współpracę reklamową- zapraszam do kontaktu mailowego, proszę jednak o wyrozumiałość co do czasu udzielenia przeze mnie odpowiedzi.</p>
							<a href="#" class="bluebatton">Nawiązanie współpracy</a>
						</header>
					</div>
			
			</section>
		</article>
	</main>
	<footer>
		<div class="socials">
			<div class="socialdivs">
				<div class="fb">
					<i class="icon-facebook"></i>
				</div>
				<div class="yt">
					<i class="icon-youtube"></i>
				</div>
				<div class="tw">
					<i class="icon-twitter"></i>
				</div>
				<div class="gplus">
					<i class="icon-gplus"></i>
				</div>
				<div style="clear:both"></div>
			</div>
		</div>
	</footer>
</body>
</html>

 

komentarz 13 lipca 2019 przez wojbuk1985 Nowicjusz (160 p.)
body
{
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	background-color: #2F3336;
	font-size: 17px;
	color: #efefef;
}



h1.logo
{
	font-size: 44px;
	font-weight: 700;
	color:#ddd;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 5px;
	margin-top: 50px;
	margin-bottom: 40px;
}

nav
{
	background-color: #1c74b2;
	text-align: center;
}

.menu
{
	list-style-type: none;
	margin: 0;
	padding: 10px;
	font-size: 18px;
	min-height: 40px;
	line-height: 200%;
}

.menu > li
{
	display: inline-block;
	padding-left: 20px;
	padding-right: 20px;
	border-right: 1px dashed #0a2b42;
	min-height: 40px;
}

.menu > li:first-child
{
	border-left: 1px dashed #0a2b42;
}

.menu a
{
	text-decoration: none;
	color: #fff;
}

.menu a:hover
{
	color: #0a2b42;
}

.categories 
{
	width: 950px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 0px;
}

h1
{
	font-size: 44px;
	font-weight: 400;
	color: #39a5f1;
	margin-bottom: 20px;
}

.authors
{
	display: inline-block;
	margin-top: 10px;
}

.authors a
{
	opacity: 0.8;
}

.authors a:hover
{
	opacity: 1;
}

figure
{
	margin: 8px;
	padding:0;
}

figcaption
{
	margin-top: 8px;
	padding: 0;
}

.entries 
{
	width: 950px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 80px;
	margin-top: 40px;
}
#newest
{
	background-color: #191d21;
}

.entry
{
	background-color: #222930;
	padding: 10px;
	text-align: justify;
	margin-top: 40px;
	border-radius: 5px;
}

.entryimg
{
	display: inline-block;
	width: 110px;
	margin-left: 20px;
}

.entryimg img
{
	width: 90px;
	height: 90px;
	
}

.entrytxt
{
	display: inline-block;
	width: 750px;
	font-size: 15px;
}


h2
{
	font-size: 20px;
	font-weight: 400;
	color: #39a5f1;
}

.contact p
{
	margin-bottom: 50px;
}

.contact
{
	width: 950px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 80px;
}

.bluebatton
{
	text-decoration: none;
	color: #efefef;
	background-color: #1c74b2;
	padding: 15px;
	border-radius: 5px;
	font-size: 19px;
}

.bluebatton:hover
{
	background-color: #196499;
}

.socials
{
	width:100%;
	text-align: center;
	background-color: #292929;
}

.socialdivs
{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

.fb
{
	width: 250px;
	height: 155px;
	float:left;
}

.fb:hover
{
	background-color: #4668b3;
}

.yt
{
	width: 250px;
	height: 155px;
	float:left;
}

.yt:hover
{
	background-color: #d94348;
}

.tw
{
	width: 250px;
	height: 155px;
	float:left;
}

.tw:hover
{
	background-color: #3095d3;
}

.gplus
{
	width: 250px;
	height: 155px;
	float:left;
}

.gplus:hover
{
	background-color: #d95333;
}

 

1 odpowiedź

+2 głosów
odpowiedź 13 lipca 2019 przez Comandeer Guru (607,060 p.)

Najprostszym obejściem tego jest postawienie lokalnego serwera (np. XAMPP-a) i serwowanie strony z niego.

CORS to mechanizm zabezpieczający przed żądaniami do innych stron, ale blokuje przy okazji praktycznie wszystkie odwołania do plików na dysku (file:///).

Podobne pytania

–1 głos
2 odpowiedzi 2,039 wizyt
0 głosów
1 odpowiedź 143 wizyt

93,460 zapytań

142,454 odpowiedzi

322,724 komentarzy

62,838 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Kursy INF.02 i INF.03
...