Is it possible to match all subdirectories by a PageRoute or convention in Razor pages? - razor

I'd like to use same page for all subdirectories in Razor pages.
I have this in startup:
services.AddRazorPages(options =>
{
options.Conventions.AddPageRoute("/test", "{path?}");
});
But this only matches first subdirectory, such as test/my. Is it possible to match "test/my/many/wishes" and similar requests?
I'd like to avoid url rewriting, as I think using the routing approach then also helps with link formatting etc.

I know, it's a basic one. But I couldn't find it at first - here it is for root:
options.Conventions.AddPageRoute("/index", "{*url}");
https://www.learnrazorpages.com/razor-pages/routing

Related

Serving Polymer App to a /path not at root

So the first thing I want to do with a new Polymer app is deploy to a directory on an existing website. The only thing that seems to work is deploying to root /.
Let's take the Shop example. I do:
polymer init and choose shop
polymer build
Robocopy.exe .\build\bundled\ C:\inetpub\wwwroot\p\ /MIR
start http://localhost/p/
You see I'm on Windows. I assume that using IIS is irrelevant, since I'm relying on the server just to serve static content.
What do I need to edit in the shop template to make it work at the url http://localhost/p/?
The polymer-cli created apps came with assumption of serving from root level '/'. In generated project index.html you will find two comments
<!--
The `<base>` tag below is present to support two advanced deployment options:
1) Differential serving. 2) Serving from a non-root path.
Instead of manually editing the `<base>` tag yourself, you should generally either:
a) Add a `basePath` property to the build configuration in your `polymer.json`.
b) Use the `--base-path` command-line option for `polymer build`.
Note: If you intend to serve from a non-root path, see [polymer-root-path] below.
-->
<base href="/">
<!-- ... -->
<script>
/**
* [polymer-root-path]
*
* By default, we set `Polymer.rootPath` to the server root path (`/`).
* Leave this line unchanged if you intend to serve your app from the root
* path (e.g., with URLs like `my.domain/` and `my.domain/view1`).
*
* If you intend to serve your app from a non-root path (e.g., with URLs
* like `my.domain/my-app/` and `my.domain/my-app/view1`), edit this line
* to indicate the path from which you'll be serving, including leading
* and trailing slashes (e.g., `/my-app/`).
*/
window.Polymer = {rootPath: '/'};
// ...
</script>
if in this index.html file you comment out base tag and set window.Polymer rootPath to something like '/0/polymer-test/build/es5-bundled/' you will be able to navigate in app on http://localhost/0/polymer-test/build/es5-bundled/
The Polymer shop-app assumes it will be deployed on the server root. Therefore it has all of the links and routes hard-coded to that assumption.
This means, that you will have to change all of the following:
all absolute links between the pages,
all pattern parameters in app-route elements (this is not necessary when useHashAsPath = true),
all absolute imports, including the lazy ones via importHref,
update the absolute locations within the service worker (use instructions from here) and
all references to static content (CSS, images, JS files)
I'm guessing your main goal isn't porting the shop-app, but rather future proofing your own app so that it can also be deployed to non-root locations on the server.
For this, I will mention two ways, depending on which value of useHashAsPath you use for the app-location element. This setting defaults to false, which means that you must use full URLs, instead of the hashbang equivalents.
Scenario 1: useHashAsPath = true
This is the easiest of both approaches, since you simply treat all URLs between the pages as absolute links. For example: Tabs.
The next step is to reference all static content and imports via relative links.
The last step is to update your service worker as shown here.
Scenario 2: useHashAsPath = false
If you dislike the hashbang URLs, go for this scenario. As you can figure out, this approach is a bit more difficult, but still manageable (especially when you start from scratch).
Firstly, you should still use absolute links, since relative links between a complex routing scheme can quickly cause problems (e.g. when not all pages are on the same directory level).
But since absolute links are a no-go, you will have to add some additional pre-processing upon build time. The point is to prefix all links with, say __ROOT__, and then replace all of those values with your actual document root. The links would then look like something this:
Some page
And you would use gulp-replace or something similar to replace __ROOT_ with /your-document-root across all of your source files in order to produce something like this:
Some page
At this point, you've got your links fixed. But this is only part of the problem. You must also apply the same fix to all of your app-route elements. For example:
<app-route pattern="__ROOT__/some/page" [...]></app-route> // Other parameters ommited
As with other resources, such as images and CSS files, you can also include them as absolute links and add the __ROOT__ prefix, but I would advise against this and would rather use relative paths.
The last step is to update your service worker as shown here.
Read more about routing: https://www.polymer-project.org/1.0/blog/routing

Dynamic include with ASP.NET Web Pages

In ASP.NET Web Pages/Razor is there a way to include a file, such as a Helper or something similar, without knowing it's name?
In Web Forms I do this by dynamically adding a User Control, like the code below, but am wondering if there is a way of doing something similar in Web Pages?
ContentTemplateBase control = (ContentTemplateBase)Page.LoadControl("~/ContentTemplates/" + detail.Template + ".ascx");
control.DataSource = detail;
plhTemplate.Controls.Add(control);
I know I could do this with a bunch of conditional statements, like...
if (detail.Template== "Template1")
{
#MyHelpers.Template1(detail)
} else if (detail.Template== "Template2")
{
#MyHelpers.Template2(detail)
} ... etc
...but wanting to do this without having to list all possible options.
On re-reading the Web Pages documentation I see I can use the RenderPage() method to include code from another file, so this seems to be the best option.

Will html image paths still work after precompile?

I'm building a Rails app, but I'm using a plugin in which I have to render my images using only html.
Since I haven't deployed yet, all my images are in RAILS_ROOT/app/assets/images/, so to render an image I have to write the following code:
<img src="/assets/image.jpg">
But when I'm ready to deploy to the web and I perform a precompile, all my images are supposedly going to be moved to my public folder. Will the html still work to link to the image, or will I have to change to link to a different path?
The plugin I'm using is Typeahead:
application.html.erb*
<script type="text/javascript">
//....
$('#typeahead').typeahead(null, {
maxLength: 5,
displayKey: function(thing) {
return "<div class='typeahead'><img src='" + thing.image_url + "'></div>";
},
source: bloodhound.ttAdapter(),
});
</script>
things_controller.rb
def typeahead
#render json: Thing.where(name: params[:query])
q = params[:query]
render json: Thing.where('name LIKE ?', "%#{q}%")
end
*Thing.image_tag is currently set to "/assets/[image.jpg]", except for each thing it's adjusted with the proper file name.
Not only are they going to be in the public folder, but they'll be renamed to include the fingerprint.
You must use the Rails helpers for all assets, see how to here and read the rest of the guide while you're at it :)
I think you should use non-stupid-digest-assets gem as it copies all your assets(mentioned in assets precompile list) in public/assets folder and then you need not to change your code before/after compiling.To install, you just need to add it into your Gemfile.
gem 'non-stupid-digest-assets'
I hope it might help you.
Joe, my suggestion would be to create a directory in your public folder to house your images, instead us using the app/assets directory. The public folder will allow the assets to not be altered by the rails pipeline, and you can link to them reliably using any external services that need the images.
As stated in RailsGuides:
Assets can still be placed in the public hierarchy. Any assets under
public will be served as static files by the application or web server
when config.serve_static_files is set to true. You should use
app/assets for files that must undergo some pre-processing before they
are served.
So you would need to add this line in config/application.rb
config.serve_static_files = true
As described in Rails general configuration.
It looks like you're storing your image_url in your model, and that's not working because assets don't have fixed URLs in Rails. I would override the getter in your model to use the asset_path helper, so it translates the path when that attribute is read (e.g., when the JSON is generated).
Something like:
# thing.rb
[...]
def image_url
ActionController::Base.helpers.asset_path(read_attribute(:image_url))
end
[...]
Short answer, no.
But it isn't that big a deal to remedy. Just move the images you need to reference with html into your Public folder. Then you can simply reference them with this code:
<img src="/image_name.image_type">
and the html will link to the correct path, both before and after precompile. So you don't have to change any code before you deploy.
BTW: I assume image_tag and image_url are the same column and you just made a mistake in one of the two times you mentioned it. If that's the case, then don't forget to change it to simply "/[image.jpg]".

Include html pages with Google Closure

I'm working with Google Closure. I'm trying to include some html files in another one. Just like A.html import B.html and C.html, but actually, I don't get how to do that.
Can anyone could give some orientation please?
Thx in advance.
As far as I know you cant "include" html pages like that. The options you got is:
1: use ajax to fetch content
http://docs.closure-library.googlecode.com/git/closure_goog_net_xhrio.js.html
http://www.googleclosure.com/google-closure-ajax/
2: Google closure templates
https://developers.google.com/closure/templates/?csw=1
3: Use a serverside language like php to include your file.
http://www.php.net/manual/en/function.include-once.php
I really don't understand.
1) Have you HTML in JS and u don't know how to join it?
try goog.dom.appendChild(parent, child)
2) You don't know how to get it into JS?
You have to send it from server, or If I were in your shoes... use soy templates

HTML in Express and node.js?

I don't know if this a really noob question, but I have seen a lot of documentation about use Express in node.js and Express. But What I see is that they always use another lenguage called "Jade" for rendering an HTML file. Why? I'd like to know if its necesary use Jade or I can render templates in Express with HTML.
No, it's not necessary to use Jade with Express. It's just a popular option since Jade is the default for generated applications and is maintained by the same developer as Express.
They also tend to stay up-to-date with each other, such as the addition of template inheritance in jade as express dropped support for layouts.
But, there are a number of other view engines that offer built-in support for Express. And, the consolidate project can be the mediator/glue so you have even more options:
atpl
dust
eco
ect
ejs
haml
haml-coffee
handlebars
hogan
jade
jazz
jqtpl
JUST
liquor
mustache
QEJS
swig
templayed
toffee
underscore
walrus
whiskers
Note: I believe I misunderstood your question and answered too broadly at first. But, leaving the rest of what I wrote below in case it's still useful.
It's not necessary to use a view engine with Express, but can be helpful.
Express can simply .send() a value as the response:
res.send(new Buffer('whoop'));
res.send({ some: 'json' });
res.send('some html');
But, a view engine like Jade can help with generating more complex, data-driven content from a view/template. They can also help to keep your project organized by intent (separation of concerns), since views are typically kept in their own files.
Albeit, a view engine is necessary if you want to use res.render(). This method depends on the 'view engine' application setting or that you've configured an app.engine().
app.set('view engine', 'jade'); // or ejs, swig, etc.
# ...
res.render('a-view'); // looks for `a-view.jade` based on `'view engine'`
app.engine('jade', require('consolidate').jade);
# ...
res.render('a-view.jade'); // matches the extension to the `.engine()`
If you do decide to use Jade, there are multiple ways of inserting your data, including placing raw HTML in an element in your jade file. You can also insert fragments of HTML if you manually bypass the sanitizers with !{ locals.someHtmlString }
You can check out a demo of the below Jade code (albeit without passing in the locals variables) here: http://cssdeck.com/labs/qkkrzfes
//app.js
app.get('/', function(req, res){
locals.someData = {foo:'Bar'};
locals.someHTML = '<span>hello</span>'
res.render('someTemplate');
//someTemplate.jade
!!!
html
head
body
p.someClass This is plain text that goes in the paragraph
p#someId You can insert data into the text: #{locals.someData.foo}
p <a href='/'>You can just slap HTML in willy nilly</a>
p HTML is escaped by default: #{locals.someHTML}
p Escape HTML with \!{}: !{locals.someHTML}
pre
code=JSON.stringify(locals.someData, null, 2)