Running ASP.NET Boilerplate template under virtual directory - javascript

I have an Angular template created by ASP.NET Boilerplate. I have published it successfully and it is running smoothly on IIS under a website. My client, however, wants to have it run under a Virtual Directory rather than a website for itself.
I have updated the appconfig.json as below:
{
"remoteServiceBaseUrl": "http://localhost:8080/Training",
"appBaseUrl": "http://localhost:8080/Training"
}
and did the same with App in the appSettings.json:
"App": {
"ServerRootAddress": "http://localhost:8080/Training/",
"ClientRootAddress": "http://localhost:8080/Training/",
"CorsOrigins": "http://localhost:8080/Training"
}
For some reason, when I run the app, I get the following errors that it cannot load some CSS and JavaScript bundles:
I have manually changed the index.html in the wwwroot folder and added http://localhost:8080/Training/ to the beginning of each href. By doing that, all those errors have gone and now I am left with this error:
GET http://localhost:8080/assets/appconfig.json 404 (Not Found)
Which I think is related to the AppPreBootstrap.ts file, where it reads from the appconfig.json file.
Do I have to make any changes in the application settings somewhere, before publishing it, to get rid of the above issues?

Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:
private static getApplicationConfig(appRootUrl: string, callback: () => void) {
appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
return abp.ajax({
url: appRootUrl + 'assets/' + environment.appConfig,
// ...
}).done(result => {
// ...
});
}

Related

load method in THREE.FileLoader only gets the content of index.html

I've set up a very small browser project using create-js-app. I try to load a file called test.txt located in my src directory.
Following is the content of my main.js:
import * as THREE from 'three';
const loader = new THREE.FileLoader();
loader.load(
"test.txt",
function (data) {
console.log(data);
},
function (xhr) {
console.log(
"Loading file : " +
(xhr.loaded / xhr.total) * 100 +
"% loaded"
);
},
function (err) {
console.error(err);
}
);
When running my site in Chrome, I get the content of my index.html file instead of test.txt. I spent some time trying to understand this with no success.
I get this result no matter which file path I specify as first argument of loader.load(), I can even specify a file that is not existing.
Has anybody already faced this issue?
Thanks a lot.
Edit: I'm using Parcel as the bundler.
This issue comes down to internal details of create-js-app, and different web applications may host static resources (i.e. images and other assets that are not compiled source code) in different ways. But generally speaking, the src/ directory is not hosted/deployed/served on the website. If your application has the structure shown here then you probably want to put the .txt file into the public/ directory instead.
Requesting any file that cannot be found at the given URL might be giving you the index page instead, depending on how your site is set up by create-js-app.
I'm updating the answer above: I'm using Parcel. I fixed my project by adding this line:
url = require('test.txt')
The require function makes the browser import the txt file, and it returns the hashed url of the stored file. All I had to do next was to call
loader.load(url, ... )

How do I use a downloaded svg file within my application using Tizen Web studio?

I can get an SVG file downloaded, additionally, I can display svg files as you would normally within an image tag. I do not know how to access the folder location for downloads or the wgt-private folder so I may download images to a client's watch and then use the downloaded version.
I'm sure my file is downloading as I've console logged on successful download and when I list the items in the directory the file shows up.
Placing downloads/[filename] or wgt-private/[filename] does not appear to work as these are virtual file locations however I've no idea how to access these files within the application without using the filesystem methods.
Download:
var download_obj = new tizen.DownloadRequest('someFile.svg', 'wgt-private');//Hidden the actual location however this file does display when enterting the whole file location
tizen.download.start(download_obj, {
onprogress: function(id, receivedSize, totalSize) {
console.log(id);
console.log(receivedSize);
console.log(totalSize);
},
onpaused: function(id) {
console.log(id);
},
oncanceled: function(id) {
console.log(id);
},
oncompleted: function(id, fullPath) {
console.log(id);
console.log(fullPath);
},
onfailed: function(id, error) {
console.log(id);
console.log(JSON.stringify(error));
}
});
Full path comes out as: wgt-private/someFile.svg
Doesn't display as displays a file error in the console on all attempts.
I understand that your questions relates to how to show the image downloaded with tizen.download API in html img tag.
I can see two workarounds that could help you with it:
You can use filesystem API (which you would like to avoid), BUT since 5.0 there is a method which needs no additional privileges and I hope it will match your needs - FileSystemManager.toURI(). It just gets the path to file (returned by download API) and returns the full URI, able to be used in img.
I noticed that download to non-public directories on the device, download API returns the 'hidden' path which uses virtual root, but when downloading to public directory as 'downloads', the full path is returned and it works for img as well.
If both of above is not acceptable for you, I am afraid that the only alternative is to use regular tizen.filesystem API and resolve the path from download API and then use File.toURI() function to get the path.
var link = "http://techslides.com/demos/samples/sample.jpg"
var download_obj = new tizen.DownloadRequest(link, 'wgt-private');//Hidden the actual location however this file does display when enterting the whole file location
tizen.download.start(download_obj, {
oncompleted: function(id, fullPath) {
console.log("completed " + id + " : " + fullPath);
tizen.filesystem.resolve(fullPath, (s)=>{console.log("Resovled full path: " + s.toURI())}, (e) => {console.log(e)})
},
onfailed: function(id, error) {
console.log("failed " + id);
console.log(JSON.stringify(error));
}
});
You can find the proper web sample app: new Tizen project - Sample - Mobile 4.0 - Web application - Content - Download Manager
Open index.html and replace https://www.sample-videos.com/video/mkv/720/big_buck_bunny_720p_10mb.mkv with your file address.

Edited partial file doesn't update

I'm using gulp-newer on my project to check which html file have been updating, and to prevent the reload of every html file in the project.
Everything is working fine except the partial files.
If I edit something in a partial the file will be update correctly but the file in which I call the partial won't be update.
I saw that there is an options.extra with gulp-newer but can't make this work.
My idea is to reload every html files if I update something in one of the partials, and keep the single file reload if I work on a basic file.
Here my task:
// COMPILE SLIM TO HTML
// ---------------------------------------------------------
gulp.task('slim', function () {
return gulp.src(slim_dev + '/**/*.slim')
// prevent server from crashing
.pipe(plugins.plumber({ errorHandler: function(err) {
plugins.notify.onError({
title: "Gulp error in " + err.plugin
})(err);
}}))
// compile slim to html
.pipe(plugins.slim({
pretty: false,
include: true
}))
.pipe(plugins.newer('build/views/'))
// minify html
.pipe(plugins.minifyHtml())
// copy result to build folder
.pipe(gulp.dest(slim_build))
// reload server on slim save
.pipe(stream({once:true}))
// notify when task completed
.pipe(plugins.notify('Slim compilation completed !'));
});

sitemap not created until server restart in meteor

I am using meteor to create simple blog system. For sitemaps files I'm using this package.
I added some initialize data in server startup function (create some post) and used below code (server/sitemaps.js) in server to create sitemaps for each category (e.g. sitemap1.xml for first category and etc):
function sitemapOutput(categoryName){
var out = [], posts = Posts.find({ category: categoryName }).fetch();
_.each(posts, function(post) {
out.push({
page: post.url(),
lastmod: post.insertDate,
changefreq: 'weekly'
});
});
return out;
}
Categories.find().forEach(function(Category, index) {
sitemaps.add('/sitemap' + (index+1) +'.xml',
function(){ return sitemapOutput(Category.name); });
});
And I have startup like this: (server/startup.js)
Meteor.startup(function () {
// some post and category created here
});
But sitemaps didn't exist until server restart (my robots.txt files also empty) but when server restarted sitemaps and robots.txt content created for me.
I think posts inserted after sitemaps.js but what's the problem guys and how to fix that?
New try:
I try new solution like below but this code also didn't work. (I want to create seperate sitemap file for each 10000 category to prevent big sitemap and google sitemap error):
for (var i=0;i<=Math.round(Categories.find().count()/10000);i++) {
sitemaps.add('/sitemap' + i +'.xml', function(){
var out = [];
Categories.find({}, {sort: {insertDate: 1} ,limit: 10000, skip: i * 10000}).forEach(function(Category) {
out.push({
page: "/category/" + Category.title + "/" + Category._id,
lastmod: Category.insertDate,
changefreq: 'weekly'
});
});
return out;
});
}
robots.txt show sitemap files correctly but all sitemap is empty like this:
<urlset> </urlset>
When does sitemaps.add() run? I think it does on server restart but New try was disappointed me and I think my guess is incorrect and If sitemaps.add() was run why it's empty.
Your problem seems to be the folder structure. You said you have /server/sitemaps.js and /server/startup.js and you wish that sitemaps would run after your startup, but the thing is Meteor will run those files alphabetically, so sitemap comes before startup. If you place your startup.js inside a lib folder, such as /server/lib/startup.js, you'll get the desired results, because Meteor will run lib folder before others.
It's normal behavior, the code at Meteor.startup will run just once at app start. If you're looking to re run this function you either need to use meteor method to call the function from the client or you can you use something like cron job to run repeat jobs here is a great package https://atmospherejs.com/percolate/synced-cron

IIS 7.5 not resolving relative path in JavaScript file

I'm working on a simple JavaScript web app with a file structure of:
index.html
scripts/
| main.js
styles/
| main.css
templates/
| options.mst
| progress.mst
The JavaScript and CSS files are loading fine, and then I grab the templates with an AJAX call:
_.each(['options', 'progress'], function (templateName) {
$.ajax({
url: '../templates/' + templateName + '.mst',
success: function (data) { templates[templateName] = data },
error: function () { console.log('Could not load template: ' + templateName); },
});
This works fine when I serve the site from Python's SimpleHTTPServer, but now that I'm trying to move it to a local IIS 7.5 server it's forming the template URL as though the JavaScript were executing from the root / folder, not /scripts. In other words I'm getting a 404 when it looks for http://localhost/templates/options.mst instead of http://localhost/my-app/templates/options.mst. Does anyone know why this is happening? I've looked at some related posts like this one, but I'd rather not use anything IIS-specific in my code like the ~ operator.
UPDATE: I followed the instructions on this page to enable "parent paths", but I'm still having the same results.

Categories

Resources