Update to latest Angular2/angular-universal and use relative URLs in template's HTTP request

This commit is contained in:
SteveSandersonMS
2016-04-21 11:36:27 +01:00
parent 6a325f8cc4
commit a0c47252ca
5 changed files with 17 additions and 15 deletions

View File

@@ -1,6 +1,6 @@
{ {
"name": "aspnet-prerendering", "name": "aspnet-prerendering",
"version": "1.0.0", "version": "1.0.1",
"description": "Helpers for server-side rendering of JavaScript applications in ASP.NET projects. Works in conjunction with the Microsoft.AspNet.SpaServices NuGet package.", "description": "Helpers for server-side rendering of JavaScript applications in ASP.NET projects. Works in conjunction with the Microsoft.AspNet.SpaServices NuGet package.",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {

View File

@@ -19,9 +19,10 @@ export interface BootFunc {
} }
export interface BootFuncParams { export interface BootFuncParams {
location: url.Url; location: url.Url; // e.g., Location object containing information '/some/path'
url: string; origin: string; // e.g., 'https://example.com:1234'
absoluteUrl: string; url: string; // e.g., '/some/path'
absoluteUrl: string; // e.g., 'https://example.com:1234/some/path'
domainTasks: Promise<any>; domainTasks: Promise<any>;
} }
@@ -44,8 +45,10 @@ export function renderToString(callback: RenderToStringCallback, applicationBase
const domainTaskCompletionPromise = new Promise((resolve, reject) => { const domainTaskCompletionPromise = new Promise((resolve, reject) => {
domainTaskCompletionPromiseResolve = resolve; domainTaskCompletionPromiseResolve = resolve;
}); });
const parsedAbsoluteRequestUrl = url.parse(absoluteRequestUrl);
const params: BootFuncParams = { const params: BootFuncParams = {
location: url.parse(requestPathAndQuery), location: url.parse(requestPathAndQuery),
origin: parsedAbsoluteRequestUrl.protocol + '//' + parsedAbsoluteRequestUrl.host,
url: requestPathAndQuery, url: requestPathAndQuery,
absoluteUrl: absoluteRequestUrl, absoluteUrl: absoluteRequestUrl,
domainTasks: domainTaskCompletionPromise domainTasks: domainTaskCompletionPromise

View File

@@ -2,13 +2,14 @@ import 'angular2-universal/polyfills';
import * as ngCore from 'angular2/core'; import * as ngCore from 'angular2/core';
import * as ngRouter from 'angular2/router'; import * as ngRouter from 'angular2/router';
import * as ngUniversal from 'angular2-universal'; import * as ngUniversal from 'angular2-universal';
import { BASE_URL, ORIGIN_URL, REQUEST_URL } from 'angular2-universal/common';
import { App } from './components/app/app'; import { App } from './components/app/app';
export default function (params: any): Promise<{ html: string, globals?: any }> { export default function (params: any): Promise<{ html: string, globals?: any }> {
const serverBindings = [ const serverBindings = [
ngCore.provide(ngUniversal.BASE_URL, { useValue: params.absoluteUrl }), ngCore.provide(BASE_URL, { useValue: '/' }),
ngCore.provide(ngUniversal.REQUEST_URL, { useValue: params.url }), ngCore.provide(ORIGIN_URL, { useValue: params.origin }),
ngCore.provide(ngRouter.APP_BASE_HREF, { useValue: '/' }), ngCore.provide(REQUEST_URL, { useValue: params.url }),
ngUniversal.NODE_HTTP_PROVIDERS, ngUniversal.NODE_HTTP_PROVIDERS,
ngUniversal.NODE_ROUTER_PROVIDERS ngUniversal.NODE_ROUTER_PROVIDERS
]; ];

View File

@@ -13,9 +13,7 @@ export class FetchData {
let isServerSide = typeof window === 'undefined'; let isServerSide = typeof window === 'undefined';
let options: any = isServerSide ? { headers: { Connection: 'keep-alive' } } : null; let options: any = isServerSide ? { headers: { Connection: 'keep-alive' } } : null;
// TODO: Switch to relative URL once angular-universal supports them http.get('/api/SampleData/WeatherForecasts', options).subscribe(result => {
// https://github.com/angular/universal/issues/348
http.get('http://localhost:5000/api/SampleData/WeatherForecasts', options).subscribe(result => {
this.forecasts = result.json(); this.forecasts = result.json();
}); });
} }

View File

@@ -18,9 +18,9 @@
"webpack-hot-middleware": "^2.10.0" "webpack-hot-middleware": "^2.10.0"
}, },
"dependencies": { "dependencies": {
"angular2": "2.0.0-beta.13", "angular2": "2.0.0-beta.15",
"angular2-universal": "0.90.1", "angular2-universal": "0.98.1",
"aspnet-prerendering": "^1.0.0", "aspnet-prerendering": "^1.0.1",
"aspnet-webpack": "^1.0.1", "aspnet-webpack": "^1.0.1",
"css": "^2.2.1", "css": "^2.2.1",
"isomorphic-fetch": "^2.2.1", "isomorphic-fetch": "^2.2.1",