Blazor: Failed to load resource: the server responded with a status of 404 () - web

I'm having a very difficult time trying to understand what the issue is with my blazor application. I have a client blazor which I'm updating from .net 3.1 to .net 6. I've read the instructions regarding migrating from 3.1 to 6 however my application never loads when I'm trying to debug it. It throws:
"Failed to load resource: the server responded with a status of 404 ()" error
I've read in other posts about blazor.webassembly.js not loading properly but I'm not sure what I'm doing wrong. I've checked the references for any errors. The Api reference is running properly on .NET 6 and the Shared library is using .net standard 2.0
Here is some code in case you need it.
Thanks for your time.
Index.html:
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.5" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.5" PrivateAssets="all" />
<PackageReference Include="Microsoft.Extensions.Http" Version="6.0.0" />
<PackageReference Include="System.Net.Http.Json" Version="6.0.0" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\SkillMatrix.Api\SkillMatrix.Api.csproj" />
<ProjectReference Include="..\SkillMatrix.Shared\SkillMatrix.Shared.csproj" />
</ItemGroup>
</Project>
Index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>SkillMatrix.Client</title>
<base href="/" />
<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="css/app.css" rel="stylesheet" />
</head>
<body>
<app>Loading...</app>
<div id="blazor-error-ui">
An unhandled error has occurred.
Reload
<a class="dismiss">🗙</a>
</div>
<script src="_framework/blazor.webassembly.js"></script>
</body>
</html>

Figured out the solution. I had to change the csproj from
<Project Sdk="Microsoft.NET.Sdk.Web">
to
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
based on this answer
Also make sure that the Microsoft.AspNetCore.Components.WebAssembly references on the item group are set to at least version 6.0.0

Related

Angular caching index.html for one specific url

This is weirdest it can get. I did a fresh deployment of my Angular application with all new hashed js files.
Expectation is to get new files from server including html, css, js.
It is working fine except for one url where it switches back to older version of index.html from cache which then pulls older js files from cache.
I have been trying to fix this, but I couldn't find any solution.
I have already added these files in html file
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
And this in web.config
<customHeaders>
<add name="Cache-Control" value="no-cache, no-store, must-revalidate, pre-check=0, post-check=0, max-age=0, s-maxage=0" />
<add name="Pragma" value="no-cache" />
<add name="Expires" value="0" />
</customHeaders>
But no effect of these changes.
Cache issue is related to the server not from the angular. Please look into the server configuration and headers which you are receiving in any request and you can try changing accordingly in the server configuration file till issue resolved.

Error while parsing the 'sandbox' attribute: 'ms-allow-popups' is an invalid sandbox flag

I want to make a very basic excel add-in. However I have got error after loading the xml file in Excel Online:
Does anyone know how to fix these errors?
Here is the xml file:
<?xml version="1.0" encoding="UTF-8"?>
<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0" xmlns:ov="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="TaskPaneApp">
<Id>2145a915-4e7b-473f-a879-a5a5e8654152</Id>
<Version>1.0.0.0</Version>
<ProviderName>Microsoft</ProviderName>
<DefaultLocale>en-US</DefaultLocale>
<DisplayName DefaultValue="Fun (online)"/>
<Description DefaultValue="Fun (online)"/>
<Capabilities>
<Capability Name="Workbook" />
</Capabilities>
<DefaultSettings>
<SourceLocation DefaultValue="https://localhost/PRODSERVER/Fun/addin_online/Home.html" />
</DefaultSettings>
<Permissions>ReadWriteDocument</Permissions>
</OfficeApp>
And Home.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>Fun (online)</title>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script>
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="js/Notification.js"></script>
<script src="js/Home.js"></script>
<link href="css/Common.css" rel="stylesheet" type="text/css" />
<link href="css/Office.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.min.css">
<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.components.min.css">
</head>
<body class="ms-font-m">
<div class="padding">
<button class="ms-Button" id="open">open</button>
</div>
</body>
</html>
So far as I know that first one is log noise from Microsoft (I see the same thing all the itme in Outlook), I haven't seen the second one but also looks unrelated to your add-in. Are you actually experiencing a problem?

Haxe program to hide console

I am trying to hide the console when running the Haxe application.
I am using FlashDevelop to compile Haxe into hxcpp, and this is my project.xml
<?xml version="1.0" encoding="utf-8"?>
<project>
<!-- metadata, make sure 'package' is at least 3 segments (ie. com.mycompany.myproject) -->
<meta title="haxeGame" package="haxeGame" version="1.0.0" company="xiggie" />
<!-- output -->
<app main="Main" file="haxeGame" path="bin" />
<window width="800" height="480" fps="60" background="0x000000" orientation="landscape" resizable="false" borderless="true" />
<window vsync="true" antialiasing="6" />
<!-- classpath, haxe libs -->
<classpath name="src" />
<haxelib name="openfl" />
<haxelib name="actuate" />
<!-- assets -->
<icon path="assets/texture.jpg" />
<assets path="assets" rename="assets" />
<!-- optimize output
<haxeflag name="-dce full" /> -->
<!-- Windows app: hide console -->
<setenv name="no_console" value="1" />
<flag value="subsystem:windows" />
</project>
I have tried all of these:
<haxeflag name="-D no_console" />
<haxedef name="no_console" />
<setenv name="no_console" value="1" />
Is it actually possible to remove the console from the release app?
The console should be hidden by default. To make it appear one needs to add
<setenv name="SHOW_CONSOLE" />
However, when using mingw instead of msvc as compiler, the toolchain configuration that comes with hxcpp currently does not pass the flag to the linker that avoids the creation of a console window.
To work around this, search for the mingw-toolchain.xml in your haxe installation and add the -mwindows flag to the linker configuration.
I created a pull request for this https://github.com/HaxeFoundation/hxcpp/pull/286

Can't get devices language in phonegap

I'm doing this exact example from the phonegap docs.
<!DOCTYPE HTML>
<html>
<head>
<title>getPreferredLanguage Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
function checkLanguage() {
navigator.globalization.getPreferredLanguage(
function (language) {alert('language: ' + language.value + '\n');},
function () {alert('Error getting language\n');}
);
}
</script>
</head>
<body>
<button onclick="checkLanguage()">Click for language</button>
</body>
</html>
When I click the button I want it to return the language I'm using on my phone.
It works good if I run it through the PhoneGap app, while connected to the local server on my computer (phonegap serve) however it won't work after making the .apk and installing it on my phone. What am I missing?
edit: here's the config.xml
http://pastebin.com/t6fx3jRD
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phonegap.helloworld" version="1.0.0"
xmlns="http://www.w3.org/ns/widgets"
xmlns:gap="http://phonegap.com/ns/1.0">
<name>hi bi</name>
<description>
sample stuff
</description>
<author email="support#phonegap.com" href="http://phonegap.com">
PhoneGap Team
</author>
<content src="index.html" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<preference name="phonegap-version" value="3.3.0" />
<preference name="permissions" value="none" />
<preference name="orientation" value="default" />
<preference name="target-device" value="universal" />
<preference name="fullscreen" value="true" />
<preference name="webviewbounce" value="true" />
<preference name="prerendered-icon" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="ios-statusbarstyle" value="black-opaque" />
<preference name="detect-data-types" value="true" />
<preference name="exit-on-suspend" value="false" />
<preference name="show-splash-screen-spinner" value="true" />
<preference name="auto-hide-splash-screen" value="true" />
<preference name="android-installLocation" value="auto" />
<icon src="icon.png" />
</widget>
I don't see any obvious problems, but there are five things that should be resolved.
you need to post your config.xml to this forum. If you delete that pastebin file, others will not be able to benefit from this. (If we can get it to work.)
you are using the generic file, which is not a bad thing, except the large file makes it more difficult to spot a problem.
you did NOT use <preference name="phonegap-version" value="X.X.X" />, which is not required. But since you do not, then by default you get the latest version (the bleeding edge) of the phonegap. (This might get you leading edge bugs which would be difficult to debug -- without asking for lots of help.)
Since you are using the latest version of Phonegap, and not 3.3.0, then you should reference leading edge - which does not have an full example.
Since you did NOT say what your target platform is, then perhaps you should look at the Bug List
Lastly, you might consider using an earlier version, say <preference name="phonegap-version" value="3.3.0" />, and try you build again. Oh and RTFM.
Best of Luck, Jesse

PhoneGap iOS prevent overscroll

PhoneGap version: 2.9
Test device: 3gs with iOS 6.1.3
I'm using the PhoneGap build service provided by Adobe
I want to prevent the whole app from overscrolling. I've read the related questions and added the following to my config.xml
<preference name="DisallowOverscroll" value="true" />
<preference name="UIWebViewBounce" value="false" />
which has no effect.
What am I doing wrong?
Finally found it: it's webviewbounce not UIWebViewBounce
<preference name="webviewbounce" value="false" />
PhoneGap Build will translate this to DisallowOverscroll.
See http://community.phonegap.com/nitobi/topics/2_7_0_webview_bounce_bug for discussion.
I am using PhoneGap version 3.0.0
I had to do two things to get this working:
Firstly:
I had this set in my index.html:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=medium-dpi" />
Needed to change this to:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, target-densitydpi=medium-dpi" />
When setting device height, my 100% heights were taking into consideration the status bar.
I then also had to add this line into my config.xml:
<preference name="DisallowOverscroll" value="true" />
Hope this helps,
Ian

Resources