2016-05-03 11 views
0

Ich habe ein einfaches Typoskript-Spiel (mit Phaser.io), die ich von einer ASP.net MVC-Anwendung in einer MVC 5 Ansicht Seite mit Layout ausführen (Razor) ich habe die Ansicht und den Controller hinzugefügt /Views/Home/About.cshtmlAsp.net MVC-Anwendung mit Typoskript und Phaser.io zeigt keine Bilder

@{ 
    ViewBag.Title = "About"; 
} 


<link rel="stylesheet" href="app.css" type="text/css" /> 
<script src="~/phaser.js"></script> 
<script src="~/app.js"></script> 

<div id="game"></div> 

das Spiel beginnt, aber es zeigt keine Bilder. Es sieht so aus, als wäre die Referenz auf das Bild falsch. http://asskicker3.azurewebsites.net/Home/About

Referenz ich die Bilder wie in den app.ts folgt:

preload() { 
     this.game.load.image('background',"assets/background.jpg"); 

Wenn ich eine HTML-Seite an die Wurzel meines Ordner hinzufügen, es ist alles perfekt funktionieren. http://asskicker3.azurewebsites.net/index.html

<!DOCTYPE html> 

<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 


</head> 
<body style="margin:0px; padding: 0px;"> 
    <link rel="stylesheet" href="app.css" type="text/css" /> 
    <script src="phaser.js"></script> 
    <script src="app.js"></script> 
    <div id="game"></div> 

</body> 

</html> 

Antwort: James Skemp Lösungen arbeitet. Einfach durch Hinzufügen des/alles funktioniert. Perfekt!

+0

Möchten Sie einen Ausschnitt mit dem Codeabschnitt teilen, wo Sie die Bilder vorladen? –

Antwort

2

Ihre Asset-Referenzen sind relativ.

Wenn Sie also die Netzwerkregisterkarte in einem Browser betrachten, werden Sie feststellen, dass versucht wird, die Grafik relativ zur URL zu laden. Beispiel: http://asskicker3.azurewebsites.net/Home/assets/background.jpg

Eine Möglichkeit, dies zu beheben, wäre, Ihre preload so zu ändern, dass die Asset-URLs absolut und nicht relativ sind. So

this.game.load.image('background', "assets/background.jpg"); 

würde

this.game.load.image('background', "/assets/background.jpg");