Getting the 401 Status code when using the external js file - asp.net

I have created a simple web site in asp.net and I have used the two js file on my page Code of
customerpage.aspx page
<head runat="server">
<title>Sample Site</title>
<!-- jQuery -->
<script type="text/javascript" src="http://localhost:63645/Customer/GetResources?resourceName=CUST.Data.Scripts.3rdParty.jquery.min.js"></script>
<script src="http://localhost:63645/index.js"></script>
<link rel="stylesheet" href="http://localhost:63645/index.css">
</head>
I have used the ajax call.
When I ran the project it gives me error the server responded with a status of 401 (Unauthorized).
To use External java-script it might need username and password, so I have download these files to my local folder where project exists and tried to run the project and still getting same error.
Code after downloaded the files to local.
<script src="js/CUST.Data.Scripts.3rdParty.jquery.min.js"></script>
<script src="js/index.js"></script>
<link href="css/index.css" rel="stylesheet" />
I don't know what is wrong. Any help will be much appreciated.

After spending time I have found the solution by changing
Change:
settings.AutoRedirectMode = RedirectMode.Permanent;
To:
settings.AutoRedirectMode = RedirectMode.Off;

Related

css file not being downloaded react

I have a react application , which I created with Create React App. The app is working fine in development, but in production , the CSS styles are not getting applied. I noticed that, the generated index.html file has the link tag for the bundled stylesheet (main.e72c9739.css), but browser is not downloading the CSS ( there is no network invocation in the dev tools ). The file does get downloaded, when I try manually by entering the address of the URL.
Here is the index.html code
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<base href="/proxy/myusername/services/someserviceid/proxy/8098/"/>
<link rel="icon" href="favicon.ico"/>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<meta name="theme-color" content="#000000"/>
<meta name="description" content="Web site created using create-react-app"/>
<link rel="apple-touch-icon" href="logo192.png"/>
<link rel="manifest" href="manifest.json"/>
<title>React App</title>
<script defer="defer" src="/proxy/myusername/services/someserviceid/proxy/8098/static/js/main.01dd9c66.js"></script>
<link src="/proxy/myusername/services/someserviceid/proxy/8098/static/css/main.e72c9739.css" rel="stylesheet">
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<h1>Hello</h1>
</body>
</html>
One difference I noticed was, in case of development, the css is not explicitly referred via link tag, all the CSS definitions are available in the bundle.js file (along with some code of CSS_LOADER_EXPORT module).
P.S. The application is deployed in a subpath, and I am using nginx for forwarding the request to react app running on a different port. I also do response modification for appending the base path of the URL.

EnvironmentTagHelper renders itself on webpage including all content

I have a dotnet 5 MVC project I maintain. Throughout subpages I use the environment tag helper to include some JS files, un-minified in development, and minified in production. I put these in a #section which is the included in my _Layout.cshtml file.
In some instances, when I run the project or deploy the site to Azure App Service, some pages work as expected and only load one version of the files. In other pages it puts the whole <environment> block thus including both un and minified versions, causing all my JS to run twice.
In my cshtml files I put this:
#section Scripts
{
<environment names="Development">
<script src="/js/insights.js"></script>
</environment>
<environment names="Staging,Production">
<script src="/js/insights.min.js"></script>
</environment>
}
Which in this instance produces this in my view
<script src="/js/insights.js"></script>
But when I include
#section Scripts
{
<environment names="Development">
<script src="/js/users.js"></script>
<script src="/js/notifications.js"></script>
</environment>
<environment names="Staging,Production">
<script src="/js/users.min.js"></script>
<script src="/js/notifications.min.js"></script>
</environment>
...
some other inlined JS
}
I get this in my html
<environment names="Development">
<script src="/js/users.js"></script>
<script src="/js/notifications.js"></script>
</environment>
<environment names="Staging,Production">
<script src="/js/users.min.js"></script>
<script src="/js/notifications.min.js"></script>
</environment>
In _Layout.cshtml I have
#RenderSection("Scripts", required: false)
On the pages I have issues with, I've tried splitting the including scripts from the in line scripts which doesn't help. I've tried names and includes both of which are supported fields. Makes no difference. They aren't in different .net Areas, there are no special #includes on the page, I have #addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers in my ViewImports file. But I do not understand why this has issues on a few pages.

Access external css file in Tomcat error pages

I have a Tomcat 10 setup in a development environment with a custom 403 error page. My 403 error page look something like this.
<html>
<head>
<link rel="stylesheet" type="text/css" media="all"
title="Default" href="default/style-1.0.2.css" />
<link rel="alternate stylesheet" type="text/css" media="all" title="Paper White"
href="default/print-1.0.1.min.css" />
<title>403 Forbidden</title>
</head>
<body>
<h3>You do not have required permissions to view this page.</h3>
</body>
</html>
When I reproduce this, I am getting a 403 error while accessing external CSS files.
403 error screenshot
My theory is that as the tomcat recognizes this request as 403, it is not allowing the request to access the underlying CSS resources as well.
Is there a way to bypass this?

Public Files in ASP.NET 5

I'm dipping my toes into ASP.NET 5 (vNext). To do that, I downloaded Visual Studio 2015 RC. I created a new ASP.NET Web Application. Then, in the next dialog I chose "Empty". From there I added a basic controller and a basic view.
I want to add bower and reference Zurb Foundation. However, I'm not sure how to do that. I've added a bower.json and .bowerrc file. Traditionally, I would install my bower packages in a directory called "libraries". I configured it like so:
.bowerrc
{
"directory" : "/public/libraries"
}
Then, in my views, I'd have code that looked like this:
<link rel="stylesheet" src="~/public/libraries/foundation/foundation.min.css" />
I can see that when I run bower, I am in fact downloading the libraries and they are being placed in /public/libraries. However, when I deploy it, there seems to be an issue. It looks like the deployment is getting ran from wwwroot. However, I'm not sure what to do about
Client-side packages loaded via bower
My resources (i.e. images, css, javascript, fonts, etc.) that I need my app to use.
What do I need to do to access static files a) during development which seems to use the typical file structure and b) during deployment where the stuff seems to run from wwwroot?
During development and production, you need to put stuff under the webroot if you have it defined. You can do this by gulp or grunt task. See here for an example.
Assuming you have the following structure:
└───wwwroot
├───js
│ └───foo.js
│ └───bar.js
You will be able to reach out to them by:
<link rel="stylesheet" src="~/js/bar.js" />
<link rel="stylesheet" src="~/js/foo.js" />
You should not be making reference in your views to the location of the bower dependencies, instead you should be referencing the relative path within wwwroot.
To see how it all fits I recommend creating a new project using the ASP.NET 5 Web Page template in VS 2015 RC.
In package.json your tool dependencies (resolved by npm) are listed. Notice for the default project gulp is included here. Gulp is the default task runner but you can use any task runner you like. The bower dependencies by convention are defined in bower.config.
By convention the location for bower dependencies is bower_components off the
project root.
If you look in gulpfile.js you will see that it copies the dependencies from bower_compontents to /lib off the project webroot (/wwwroot by default).
In the view _Layout.cshtml you will see the references to the libraries is ~/lib not /bower_components.
#inject IOptions<AppSettings> AppSettings
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>#ViewBag.Title - #AppSettings.Options.SiteTitle</title>
<environment names="Development">
<link rel="stylesheet" href="~/lib/bootstrap/css/bootstrap.css" />
<link rel="stylesheet" href="~/lib/bootstrap-touch-carousel/css/bootstrap-touch-carousel.css" />
<link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment names="Staging,Production">
<link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/bootstrap/3.0.0/css/bootstrap.min.css"
asp-fallback-href="~/lib/bootstrap/css/bootstrap.min.css"
asp-fallback-test-class="hidden" asp-fallback-test-property="visibility" asp-fallback-test-value="hidden" />
<link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/bootstrap-touch-carousel/0.8.0/css/bootstrap-touch-carousel.css"
asp-fallback-href="~/lib/bootstrap-touch-carousel/css/bootstrap-touch-carousel.css"
asp-fallback-test-class="carousel-caption" asp-fallback-test-property="display" asp-fallback-test-value="none" />
<link rel="stylesheet" href="~/css/site.css" />
</environment>
</head>
So in summary:
Define client side dependencies in bower.config (or using some
other package mananger)
Use gulp scripts to manage tasks (copying, minifying, etc).
Only make references in views to locations within webroot (using ~ relative paths).
When you build/publish all dependencies should be resolved prior to deploying
to server.

Dynamically referencing a javascript file

Kinda related to my first question, my site runs fine locally but as soon as I deploy to IIS the javascript file/s are not being called properly.
In the <head> tag of my Master page:
<script src='/Assets/jquery-1.4.2.min.js' type="text/javascript"></script>
<script src='/Assets/hoverIntent.js' type="text/javascript"></script>
<script src='/Assets/superfish.js' type="text/javascript"></script>
<script src='/Assets/supersubs.js' type="text/javascript"></script>
This works on visual studio dev server but not on IIS. I tried adding ~ and saying runat="server" but it just gives some jquery error ("Unexpected character '\'" on Line 18 of the minified jquery) when trying to run it.
Use Page.ResovleUrl for all of your files:
<script src='<%# Page.ResolveUrl("~/Assets/jquery-1.4.2.min.js")%>' type="text/javascript"></script>

Resources