IIS url rewrite - css and js incorrectly being rewritten - javascript

Having an issue with my urlrewrites - anytime I point to a page that is to be rewritten it fails to display because it is also applying the rule to the css & js files that are referenced within my webpage.
To try and remedy this I put in a fully qualified path to the css and js - this renders fine on any page where the rewrite isnt applied yet when i try to access a rewritten page the browser hangs.
Has anyone encountered something similar and if so have you a solution? Appreciate any help. Tried looking on the site at similar issues but none have helped so far.
<rewrite>
<outboundRules>
<rule name="OutboundRewriteUserFriendlyURL1" preCondition="ResponseIsHtml1" stopProcessing="true">
<match filterByTags="A, Form, Img" pattern="^(.*/)myapplicationname/Index\.html\?team=([^=&]+)$" />
<action type="Rewrite" value="{R:1}team/{R:2}/" />
</rule>
<preConditions>
<preCondition name="ResponseIsHtml1">
<add input="{RESPONSE_CONTENT_TYPE}" pattern="^text/html" />
</preCondition>
</preConditions>
</outboundRules>
<rules>
<rule name="RedirectUserFriendlyURL1" stopProcessing="true">
<match url="^myapplicationname/Index\.html$" />
<conditions>
<add input="{REQUEST_METHOD}" pattern="^POST$" negate="true" />
<add input="{QUERY_STRING}" pattern="^([^=&]+)=([^=&]+)$" />
</conditions>
<action type="Redirect" url="{C:1}/{C:2}" appendQueryString="false" />
</rule>
<rule name="RewriteUserFriendlyURL1" stopProcessing="true">
<match url="^([^/]+)/([^/]+)/?$" />
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="Index.html?{R:1}={R:2}" appendQueryString="false" />
</rule>
</rules>
</rewrite>
within my webpage:
<script src="/myapplicationname/Scripts/jquery-1.4.1.js" type="text/javascript"> </script>
<link href="/myapplicationname/Styles/MainStyle.css" rel="stylesheet" type="text/css" />
it is applying the rewrite to these and trying to find /myapplicationname/Team/Styles/MainStyle.css and similar with the JS file.

Try to find out which rule is causing the problem by removing them one by one. Now add a condition to that rule:
<rule name="Some rule">
...
<conditions logicalGrouping="MatchAny">
<add input="{URL}" pattern="^.*\.(ashx|axd|css|gif|png|jpg|jpeg|js|flv|f4v)$" negate="true" />
</conditions>
</rule>
This will avoid running the rule on files ending with .js, .css, etc.

Related

Unable to remove # in AngularJS

The application is making use of the following:
AngularJS (v1.6.4)
webpack
ui-router
One requires the path to be independent of the # in the url.
For this I have added the following in the code:
In app.js
/* in the config section */
$locationProvider.hashPrefix('');
$locationProvider.html5Mode(true);
In index.html
<!-- under the head section -->
<base href="/">
When fired in the below format from address
'http://localhost/pathName'
it gives the following error:
Cannot GET /pathName
But the same works well when accessed through hyperlinks.
Also, on accessing 'http://localhost/#/pathName', the browser modifies the same to 'http://localhost/pathName'.
Is there a way by which the url can be accessed through GET request, by configuring from webpack (or some other way)?
EDIT 1:
Routing Code:
.config(($stateProvider) => {
$stateProvider
.state('pathName', {
url: '/pathName',
template: '<pathNameTemplate />'
});
})
No html5:
user types www.site.com/#/section in browser
request is sent for www.site.com (#... is ignored)
server return index.html
angular launches and see that there is # -- loads specific view
Html5:
user types www.site.com/section in browser
request is sent for www.site.com/section
server return index.html
angular launches and see that there is / -- loads specific view
So server MUST return index.html for all your paths - i.e. this means that you can not make it work from file system (file://.../). You need server and configure it adding redirects
P.S. you do not need this line
$locationProvider.hashPrefix('');
This is sample to remove # from url using
AngularJs v1.5.7
ui-router v0.4.2
web.config
app.js
var app = angular.module("app", ["ui.router"]);
app.config
var config = function (locationProvider) {
locationProvider.html5Mode(true);
}
config.$inject = ["$locationProvider"];
app.config(config);
index.html
<head>
<base href="/" />
</head
If you don't use IIS Service, and use Apache service such as xamp or etc... for your localhost change it to <base href="/sample/" />
web.config
<rewrite>
<rules>
<rule name="Main Rule" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
Note: you have to add this config because without it, when # removed after refresh [F5] you lose the state.
Remember In Apache (PHP) configs are different, and users have to add the settings in the .htaccess file.

IIS outboud rule to match the non-existance of substring in file name

I have the following IIS configuration which forces PDFs to be downloaded as files in the browser instead of opening in the browser window.
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<outboundRules>
<rule name="Force Download for PDFs" preCondition="FileIsPDF">
<match serverVariable="RESPONSE_Content-Disposition" pattern=".*" />
<conditions>
<add input="{REQUEST_FILENAME}" pattern="(.*)\\([^/]+)\.pdf$" />
</conditions>
<action type="Rewrite" value="attachment; filename={C:2}.pdf" />
</rule>
<preConditions>
<preCondition name="FileIsPDF">
<add input="{REQUEST_FILENAME}" pattern="\.pdf$" />
</preCondition>
</preConditions>
</outboundRules>
</rewrite>
</system.webServer>
</configuration>
However I need it to not apply if the file name is xxx_print.pdf, in other words I want the above rule to match all .pdf files except those that have _print at the end of the file name.
How is this possible? Needs to work for IIS7 and above.
Note you may be able to answer this without an understanding of IIS if you know how to use javascript's regular expression to match a string without a particular substring.
Turned out I just had to add another condition to the rule with the negate="true" attribute:
<add input="{REQUEST_FILENAME}" pattern="(.*)\\([^/]+)_print\.pdf$" negate="true" />

Magento: jQuery in custom file does not work

So I am trying to add some simple jQuery to a magento-theme.
I have put my jQuery in an external file, which lies in the "js" (skin/frontend/default/myTheme/js) folder of the theme.
Here is the link to my site: http://shop.veivecouture.com/
I am including it in the page.xml file with the following method:
<action method="addItem"><type>skin_js</type><name>js/functions.js</name></action>
I have also tried:
<action method="addJs"><script>../skin/frontend/default/trego/js/functions.js</script></action>
I put them both in the "Head" block like this:
<block type="page/html_head" name="head" as="head">
<action method="addJs"><script>prototype/prototype.js</script></action>
<action method="addJs"><script>lib/ccard.js</script></action>
<action method="addJs"><script>prototype/validation.js</script></action>
<action method="addJs"><script>scriptaculous/builder.js</script></action>
<action method="addJs"><script>scriptaculous/effects.js</script></action>
<action method="addJs"><script>scriptaculous/dragdrop.js</script></action>
<action method="addJs"><script>scriptaculous/controls.js</script></action>
<action method="addJs"><script>scriptaculous/slider.js</script></action>
<action method="addJs"><script>varien/js.js</script></action>
<action method="addJs"><script>varien/form.js</script></action>
<action method="addJs"><script>varien/menu.js</script></action>
<action method="addJs"><script>mage/translate.js</script></action>
<action method="addJs"><script>mage/cookies.js</script></action>
<block type="page/js_cookie" name="js_cookies" template="page/js/cookie.phtml"/>
<action method="addItem"><type>skin_js</type><name>js/functions.js</name></action> <!-- my line -->
<action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
<action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
<action method="addCss"><stylesheet>css/widgets.css</stylesheet></action>
<action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action>
<action method="addItem"><type>js</type><name>lib/ds-sleight.js</name><params/><if>lt IE 7</if></action>
<action method="addItem"><type>skin_js</type><name>js/ie6.js</name><params/><if>lt IE 7</if></action>
</block>
I can get to both files via "view source", so the linking seems to be right, however no jQuery takes effect.
What am I doing wrong?
This is the javascript in the functions.js file:
$('.block-content').hide(); //edit by Carl Papworth
$('.block-title').click(function(e){
e.preventDefault();
$('.block-content').show();
$('.close-block').click(function(e){
e.preventDefault();
$('.block-content').hide();
});
});
Put the file into magento js folder and try
<action method="addJs"><script>js/your_custom_folder/functions.js</script></action>
Try to add jQuery.noConflict(); at the very bottom of your js file.
Add this to your head part:
<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/specification.js');?>" media="screen"></script>

Render default image when image not found on server

I have a web page which renders images from a server. If the image is not found, currently the IIS server returns 404 error and hence the image is not rendered.
I have a requirement to put a default image in case the image is not found on the server.
Can I make this setting on the IIS server so that it returns the default image for every invalid image requests?
You can use the javascript onerror() event for images that are not found:
function imgError(image) {
image.onerror = "";
image.src = "somePlaceholderImage.gif";
return true;
}
then your images would be like this:
<img alt="some ALT text" src="http://someurlhere" onerror="imgError(this);">
<rewrite>
<rules>
<rule name="RewriteNoneExist">
<match url="\.(gif|jpe?g|png|bmp)" ignoreCase="true" />
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
</conditions>
<action type="Rewrite" url="gfx/default.png" />
</rule>
</rules>
</rewrite>

How to remove index.html from url on website based on angularjs

I didn't find a way to remove index.html from the url, because like this looks really ugly.
mydomain.com/index.html#/myview1
mydomain.com/index.html#/myview2
Is there a way to remove that part, like that url will be so clear where the user is.
mydomain.com/myview1
mydomain.com/myview2
Tnx in advance for your time.
Edit:
I just find way that it could work like:
mydomain.com/#/myview1
mydomain.com/#/myview2
which is pretty much better then with index.html.
But still if there is a way for shorter solution let me know.
Maybe this approach could help:
Add $locationProvider.hashPrefix();, which removes index.html in your URL, in your app.js config. Don't forget to add the new dependency. After that your app.js could look similar to this:
angular.module('myApp', [
'ngRoute'
]).
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
$locationProvider.hashPrefix(); // Removes index.html in URL
$routeProvider.otherwise({redirectTo: '/someroute'});
}]);
Note that this does not remove the hashtag.
You can find your new route at: .../app/#/someroute
activate the html5mode for $location
You'll have to do some work on the server side to set this up. html5mode gets you part of the way, but as soon as the user refreshes, the reference to the file will be wrong. You want links that are persistent and can be shared, presumably. Basically make sure any request to url.com/myapp/{etc} (or whatever) gets redirected to index.html and let your angular app sort out the routing.
Use
<rewrite>
<rules>
<rule name="RewriteRules" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/index.html" />
</rule>
</rules>
</rewrite>
And on Index page
<base href="/" />
And on your config use
$locationProvider.html5Mode(true);
It should work

Categories

Resources