I try to use http/2 server-push to preload some assets within a Laravel Website.
<!-- Preload -->
<link href="/fonts/Logo.woff" as="font" type="font/woff" rel="preload" crossorigin>
<link href="/css/app.css" rel="preload" as="style" type="text/css" crossorigin>
<link href="/js/app.js" rel="preload" type="application/javascript" as="script" crossorigin>
<!-- Use -->
<link href="/css/app.css" rel="stylesheet">
<script type="module" src="/js/app.js"></script>
I'm using a Middleware to set Link-Headers.
However, the script and font get downloaded twice (push and normal request)
They both also produce warnings
"A preload for 'https://localhost/fonts/Logo.woff' is found, but is not used because the request credentials mode does not match. Consider taking a look at crossorigin attribute."
"A preload for 'https://localhost/js/app.js' is found, but is not used because the request credentials mode does not match. Consider taking a look at crossorigin attribute."
I tried to remove crossorigin from all three tags, but this didn't solve the issue. Also tried different combinations like crossorigin="use-credentials" or crossorigin="anonymous".
Just in case someone has the same issue.
The Link HTTP-Header has to contain crossorigin for Font/Script, but not for CSS/Image
you need to add the very same preload attribute to your usage link
So instead of your
<!-- Preload -->
<link href="/fonts/Logo.woff" as="font" type="font/woff" rel="preload" crossorigin>
<link href="/css/app.css" rel="preload" as="style" type="text/css" crossorigin>
<link href="/js/app.js" rel="preload" type="application/javascript" as="script" crossorigin>
<!-- Use -->
<link href="/css/app.css" rel="stylesheet">
<script type="module" src="/js/app.js"></script>
Put
<!-- Preload -->
<link href="/fonts/Logo.woff" as="font" type="font/woff" rel="preload" crossorigin>
<link href="/css/app.css" rel="preload" as="style" type="text/css" crossorigin>
<link href="/js/app.js" rel="preload" type="application/javascript" as="script" crossorigin>
<!-- Use -->
<link href="/css/app.css" rel="stylesheet" crossorigin>
<script type="module" src="/js/app.js" crossorigin></script>
Related
My website’s open graph image/ Feature image does not show up when I paste my link on WhatsApp desktop Browser (mobile works fine).
May I know how to check the possible root cause?
I already use below code...
<meta property="og:title" content="Og image testing | inspify.com" />
<meta property="og:type" content="Most popular business directory of SG" />
<meta property="og:url" content="https://dummy.app.app/" />
<meta
property="og:image"
itemprop="image"
content="https://dummy.app/img/ogimage_256.jpg"
/>
<meta
property="og:image:secure"
itemprop="image"
content="https://dummy.app/img/ogimage_256.jpg"
/>
<meta property="og:site_name" content="#website" />
<meta property="fb:admins" content="Author" />
<link itemprop="thumbnailUrl" href="https://dummy.app/img/ogimage_256.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta
property="og:description"
content="https://dummy.app is your online business directory of Country"
/>
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
Thank you
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
Root directory inside iisnode
inside client directory
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>ANSYS Licensing Portal</title>
<base href="/node/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="" crossorigin="anonymous">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="" crossorigin="anonymous"></script>
<link rel="stylesheet" href="styles.82aa555aa62ae3bd79d8.css"></head>
<body>
<style>...</style>
<app-root>
<div class="top-container">
<mat-toolbar class="mat-elevation-z2 toptoolbar">
<div class="divlogo">
<img class="logoloading" src="" alt="Portal Logo">
</div>
<div>
<p class="loading"> Portal Loading...</p>
</div>
<span class="app-toolbar-filler"></span>
</mat-toolbar>
</div>
</app-root>
<script type="text/javascript" src="runtime.4501af5c35d1125f6901.js"></script>
<script type="text/javascript" src="polyfills.c466c90744ce632ac8b9.js">
</script><script type="text/javascript" src="scripts.2491a780f92813f20e72.js"></script>
<script type="text/javascript" src="main.c1b82e811a8fb7c4cdaf.js"> </script></body>
</html>
I am running iisnode. I deployed the project into iisnode as shown in question link. I have enabled directory browsing. I have shown web.config,app.js and here I will post index.js as well.
I have static contents in client directory. I have node.js contents in server directory. Please note I have only one web.config for entire, I don't web.config per directory, Is this ok?
Snapshot of error
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?
Please see the HTML Below. This is being used to play videos uploaded to Azure.
It only works on a couple of pc's, but in general it fails. For example latest Firefox and IE11.
Any tips, fixes, would be great ...
regards,
Jon.
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta name="robots" content="noindex, nofollow" />
<base href="http://www.example.com/doc/" />
<meta http-equiv="pragma" content="no-cache" />
<meta name="description" content=" " />
<meta name="Content-Language" content="en" />
<meta http-equiv="pragma" content="Privat" />
<meta http-equiv="expires" content="-100" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>E-Experience Video</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//amp.azure.net/libs/amp/1.6.2/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
<script src="//amp.azure.net/libs/amp/1.6.2/azuremediaplayer.min.js"></script>
<video id="asmmedia" class="azuremediaplayer amp-default-skin " controls autoplay width="740" height="428" poster="" data-setup='{"logo": { "enabled": false}, "techOrder": ["azureHtml5JS", "flashSS", "silverlightSS", "html5"], "nativeControlsForTouch": false}' tabindex="0">
<source src="http://asmsoutheastasia%2Estreaming%2Emediaservices%2Ewindows%2Enet%2Fc75725e6%2D18c7%2D422a%2Dbe38%2D8b03ef4d11f7%2FJC%2DAC%2D297%2DV1%2DCalibration+%2D+Gantry+Axis+%2Eism%2FManifest" type="application/vnd.ms-sstr+xml" />
<p class="amp-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
</video>
</div>
</html>
it looks like your manifest is 404ing right now, do you have a repro URL for this issue?