mraible 7 anni fa
parent
commit
4eedb5cb16

+ 16
- 16
TUTORIAL.md Vedi File

176
 
176
 
177
 ## Upgrade to Angular 2.3
177
 ## Upgrade to Angular 2.3
178
 
178
 
179
-With Angular versions less than 2.3, you can’t extend components and override their templates. The Ionic pages for Stormpath module uses component extension to override the templates in its pages. Because of this, you have to upgrade your project to use Angular 2.3. The only downside to use Angular 2.3 with Ionic 2.0.0 is that you won’t be able to use the `--prod` build flag when compiling. This is because its compiler does not support Angular 2.3. 
179
+With Angular versions less than 2.3, you can’t extend components and override their templates. The Ionic pages for Stormpath module uses component extension to override the templates in its pages. Because of this, you have to upgrade your project to use Angular 2.3. The only downside to use Angular 2.3 with Ionic 2.0.0 is that you won’t be able to use the `--prod` build flag when compiling. This is because its compiler does not support Angular 2.3.
180
 
180
 
181
-To begin, modify `package.json` so all the `angular` dependencies use version `2.3.1` rather than `2.2.1`. 
181
+To begin, modify `package.json` so all the `angular` dependencies use version `2.3.1` rather than `2.2.1`.
182
 
182
 
183
 ```json
183
 ```json
184
 "dependencies": {
184
 "dependencies": {
237
 export class AppModule {}
237
 export class AppModule {}
238
 ```
238
 ```
239
 
239
 
240
-To render a login page before users can view the application, modify `src/app/app.component.ts` to use the `Stormpath` service and navigate to Stormpath's `LoginPage` if the user is not authenticated. 
240
+To render a login page before users can view the application, modify `src/app/app.component.ts` to use the `Stormpath` service and navigate to Stormpath's `LoginPage` if the user is not authenticated.
241
 
241
 
242
 ```typescript
242
 ```typescript
243
 import { Component } from '@angular/core';
243
 import { Component } from '@angular/core';
276
 
276
 
277
 ```
277
 ```
278
 XMLHttpRequest cannot load https://raible.apps.stormpath.io/me. Response to preflight request
278
 XMLHttpRequest cannot load https://raible.apps.stormpath.io/me. Response to preflight request
279
-doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on 
280
-the requested resource. Origin 'http://localhost:8100 is therefore not allowed access. 
279
+doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on
280
+the requested resource. Origin 'http://localhost:8100 is therefore not allowed access.
281
 The response had HTTP status code 403.
281
 The response had HTTP status code 403.
282
 ```
282
 ```
283
 
283
 
284
-To fix this, open your Spring Boot application's `src/main/resources/application.properties` and add the following line. This enables cross-origin resource sharing (CORS) from both the browser and the mobile client. 
284
+To fix this, open your Spring Boot application's `src/main/resources/application.properties` and add the following line. This enables cross-origin resource sharing (CORS) from both the browser and the mobile client.
285
 
285
 
286
 ```
286
 ```
287
 stormpath.web.cors.allowed.originUris = http://localhost:8100,file://
287
 stormpath.web.cors.allowed.originUris = http://localhost:8100,file://
351
 
351
 
352
 ## Build a Good Beers UI
352
 ## Build a Good Beers UI
353
 
353
 
354
-Run `ionic generate page beer` to create a component and a template to display the list of good beers. 
354
+Run `ionic generate page beer` to create a component and a template to display the list of good beers.
355
 
355
 
356
 Add `BeerPage` to the `declarations` and `entryComponent` lists in `app.module.ts`.
356
 Add `BeerPage` to the `declarations` and `entryComponent` lists in `app.module.ts`.
357
 
357
 
390
 export function stormpathConfig(): StormpathConfiguration {
390
 export function stormpathConfig(): StormpathConfiguration {
391
   let spConfig: StormpathConfiguration = new StormpathConfiguration();
391
   let spConfig: StormpathConfiguration = new StormpathConfiguration();
392
   spConfig.endpointPrefix = 'http://localhost:8080';
392
   spConfig.endpointPrefix = 'http://localhost:8080';
393
-  spConfig.autoAuthorizedUris.push(new RegExp('http://localhost:8080/good-beers'));
393
+  spConfig.autoAuthorizedUris.push(new RegExp(spConfig.endpointPrefix + '/*'));
394
   return spConfig;
394
   return spConfig;
395
 }
395
 }
396
 ```
396
 ```
752
 </ion-content>
752
 </ion-content>
753
 ```
753
 ```
754
 
754
 
755
-Add a `remove()` method to `beer.ts`. 
755
+Add a `remove()` method to `beer.ts`.
756
 
756
 
757
 ```typescript
757
 ```typescript
758
 remove(beer) {
758
 remove(beer) {
798
 
798
 
799
 ## PWAs with Ionic
799
 ## PWAs with Ionic
800
 
800
 
801
-Ionic 2 ships with support for creating progressive web apps (PWAs). If you’d like to learn more about what PWAs are, see [Navigating the World of Progressive Web Apps with Ionic 2](http://blog.ionic.io/navigating-the-world-of-progressive-web-apps-with-ionic-2/). 
801
+Ionic 2 ships with support for creating progressive web apps (PWAs). If you’d like to learn more about what PWAs are, see [Navigating the World of Progressive Web Apps with Ionic 2](http://blog.ionic.io/navigating-the-world-of-progressive-web-apps-with-ionic-2/).
802
 
802
 
803
 If you run the [Lighthouse Chrome extension](https://developers.google.com/web/tools/lighthouse/) on this application, you’ll get a mediocre score (54/100).
803
 If you run the [Lighthouse Chrome extension](https://developers.google.com/web/tools/lighthouse/) on this application, you’ll get a mediocre score (54/100).
804
 
804
 
817
 
817
 
818
 After making this change, the score should improve. In my tests, it increased to 69/100. The remaining issues were:
818
 After making this change, the score should improve. In my tests, it increased to 69/100. The remaining issues were:
819
 
819
 
820
-* The page body should render some content if its scripts are not available. This could likely be solved with [Angular’s app-shell directives](https://www.npmjs.com/package/@angular/app-shell). 
820
+* The page body should render some content if its scripts are not available. This could likely be solved with [Angular’s app-shell directives](https://www.npmjs.com/package/@angular/app-shell).
821
 * Site is not on HTTPS and does not redirect HTTP to HTTPS.
821
 * Site is not on HTTPS and does not redirect HTTP to HTTPS.
822
-* A couple -1’s in performance for "Cannot read property 'ts' of undefined”. 
822
+* A couple -1’s in performance for "Cannot read property 'ts' of undefined”.
823
 
823
 
824
 If you refresh the app and Chrome doesn’t prompt you to install the app (a PWA feature), you probably need to turn on a couple of features. Copy and paste the following URLs into Chrome and enable each feature.
824
 If you refresh the app and Chrome doesn’t prompt you to install the app (a PWA feature), you probably need to turn on a couple of features. Copy and paste the following URLs into Chrome and enable each feature.
825
 
825
 
834
 
834
 
835
 It’s pretty cool that you’re able to develop mobile apps with Ionic in your browser. However, it’s nice to see the fruits of your labor and see how awesome your app looks on a phone. It really does look and behave like a native app!
835
 It’s pretty cool that you’re able to develop mobile apps with Ionic in your browser. However, it’s nice to see the fruits of your labor and see how awesome your app looks on a phone. It really does look and behave like a native app!
836
 
836
 
837
-To see how your application will look on different devices you can run `ionic serve --lab`. The `--lab` flag opens opens a page in your browser that lets you see how your app looks on different devices. 
837
+To see how your application will look on different devices you can run `ionic serve --lab`. The `--lab` flag opens opens a page in your browser that lets you see how your app looks on different devices.
838
 
838
 
839
 ### iOS
839
 ### iOS
840
 
840
 
852
 
852
 
853
 The biggest problem I found when running the app in Simulator was that it was difficult to get the keyboard to popup. To workaround this, I used Edit > Hardware > Keyboard > Toggle Software Keyboard when I needed to type text in a field.
853
 The biggest problem I found when running the app in Simulator was that it was difficult to get the keyboard to popup. To workaround this, I used Edit > Hardware > Keyboard > Toggle Software Keyboard when I needed to type text in a field.
854
 
854
 
855
-To deploy the app to an iPhone, start by plugging your iOS device into your computer. Then run the following commands to install ios-deploy/ios-sim, build the app, and run it on your device. If you've 
855
+To deploy the app to an iPhone, start by plugging your iOS device into your computer. Then run the following commands to install ios-deploy/ios-sim, build the app, and run it on your device. If you've
856
 
856
 
857
 ```
857
 ```
858
 npm install -g ios-deploy ios-sim
858
 npm install -g ios-deploy ios-sim
863
 
863
 
864
 Select your phone as the target in Xcode and click the play button to run your app. The first time you do this, Xcode may spin for a while with a “Processing symbol files” message at the top.
864
 Select your phone as the target in Xcode and click the play button to run your app. The first time you do this, Xcode may spin for a while with a “Processing symbol files” message at the top.
865
 
865
 
866
-Deploying to your phone will likely fail because it won't be able to connect to `http://localhost:8080`. To fix this, copy [this script](./deploy.sh) to your hard drive. It expects to be in a directory above your apps. It also expects your apps to be named `client` and `server`. 
866
+Deploying to your phone will likely fail because it won't be able to connect to `http://localhost:8080`. To fix this, copy [this script](./deploy.sh) to your hard drive. It expects to be in a directory above your apps. It also expects your apps to be named `client` and `server`.
867
 
867
 
868
 If you don't have a Cloud Foundry account, you'll need to [create one](https://account.run.pivotal.io/z/uaa/sign-up) and install its command line tools for this script to work.
868
 If you don't have a Cloud Foundry account, you'll need to [create one](https://account.run.pivotal.io/z/uaa/sign-up) and install its command line tools for this script to work.
869
 
869
 
919
 
919
 
920
 * [Get started with Ionic Framework](http://ionicframework.com/getting-started/)
920
 * [Get started with Ionic Framework](http://ionicframework.com/getting-started/)
921
 * [Getting Started with Angular](https://www.youtube.com/watch?v=Jq3szz2KOOs) A YouTube webinar by yours truly. ;)
921
 * [Getting Started with Angular](https://www.youtube.com/watch?v=Jq3szz2KOOs) A YouTube webinar by yours truly. ;)
922
-* [Stormpath Client API Guide](https://docs.stormpath.com/client-api/product-guide/latest/) 
922
+* [Stormpath Client API Guide](https://docs.stormpath.com/client-api/product-guide/latest/)

+ 3
- 5
client/src/app/app.module.ts Vedi File

5
 import { ContactPage } from '../pages/contact/contact';
5
 import { ContactPage } from '../pages/contact/contact';
6
 import { HomePage } from '../pages/home/home';
6
 import { HomePage } from '../pages/home/home';
7
 import { TabsPage } from '../pages/tabs/tabs';
7
 import { TabsPage } from '../pages/tabs/tabs';
8
-import {
9
-  StormpathConfiguration, StormpathModule, StormpathIonicModule,
10
-  LoginPage, RegisterPage, ForgotPasswordPage
11
-} from 'angular-stormpath';
8
+import { StormpathConfiguration, StormpathModule } from 'angular-stormpath';
9
+import { StormpathIonicModule, LoginPage, RegisterPage, ForgotPasswordPage } from 'angular-stormpath-ionic';
12
 import { BeerPage } from '../pages/beer/beer';
10
 import { BeerPage } from '../pages/beer/beer';
13
 import { BeerService } from '../providers/beer-service';
11
 import { BeerService } from '../providers/beer-service';
14
 import { GiphyService } from '../providers/giphy-service';
12
 import { GiphyService } from '../providers/giphy-service';
17
 export function stormpathConfig(): StormpathConfiguration {
15
 export function stormpathConfig(): StormpathConfiguration {
18
   let spConfig: StormpathConfiguration = new StormpathConfiguration();
16
   let spConfig: StormpathConfiguration = new StormpathConfiguration();
19
   spConfig.endpointPrefix = 'http://localhost:8080';
17
   spConfig.endpointPrefix = 'http://localhost:8080';
20
-  spConfig.autoAuthorizedUris.push(new RegExp('http://localhost:8080/*'));
18
+  spConfig.autoAuthorizedUris.push(new RegExp(spConfig.endpointPrefix + '/*'));
21
   return spConfig;
19
   return spConfig;
22
 }
20
 }
23
 
21
 

BIN
server/.mvn/wrapper/maven-wrapper.jar Vedi File


+ 1
- 1
server/.mvn/wrapper/maven-wrapper.properties Vedi File

1
-distributionUrl=https://repo1.maven.org/maven2/org/apache/maven/apache-maven/3.3.9/apache-maven-3.3.9-bin.zip
1
+distributionUrl=https://repo1.maven.org/maven2/org/apache/maven/apache-maven/3.3.9/apache-maven-3.3.9-bin.zip

+ 14
- 11
server/mvnw Vedi File

184
 
184
 
185
 CLASSWORLDS_LAUNCHER=org.codehaus.plexus.classworlds.launcher.Launcher
185
 CLASSWORLDS_LAUNCHER=org.codehaus.plexus.classworlds.launcher.Launcher
186
 
186
 
187
-# For Cygwin, switch paths to Windows format before running java
188
-if $cygwin; then
189
-  [ -n "$M2_HOME" ] &&
190
-    M2_HOME=`cygpath --path --windows "$M2_HOME"`
191
-  [ -n "$JAVA_HOME" ] &&
192
-    JAVA_HOME=`cygpath --path --windows "$JAVA_HOME"`
193
-  [ -n "$CLASSPATH" ] &&
194
-    CLASSPATH=`cygpath --path --windows "$CLASSPATH"`
195
-fi
196
-
197
 # traverses directory structure from process work directory to filesystem root
187
 # traverses directory structure from process work directory to filesystem root
198
 # first directory with .mvn subdirectory is considered project base directory
188
 # first directory with .mvn subdirectory is considered project base directory
199
 find_maven_basedir() {
189
 find_maven_basedir() {
219
 export MAVEN_PROJECTBASEDIR=${MAVEN_BASEDIR:-$(find_maven_basedir)}
209
 export MAVEN_PROJECTBASEDIR=${MAVEN_BASEDIR:-$(find_maven_basedir)}
220
 MAVEN_OPTS="$(concat_lines "$MAVEN_PROJECTBASEDIR/.mvn/jvm.config") $MAVEN_OPTS"
210
 MAVEN_OPTS="$(concat_lines "$MAVEN_PROJECTBASEDIR/.mvn/jvm.config") $MAVEN_OPTS"
221
 
211
 
212
+# For Cygwin, switch paths to Windows format before running java
213
+if $cygwin; then
214
+  [ -n "$M2_HOME" ] &&
215
+    M2_HOME=`cygpath --path --windows "$M2_HOME"`
216
+  [ -n "$JAVA_HOME" ] &&
217
+    JAVA_HOME=`cygpath --path --windows "$JAVA_HOME"`
218
+  [ -n "$CLASSPATH" ] &&
219
+    CLASSPATH=`cygpath --path --windows "$CLASSPATH"`
220
+  [ -n "$MAVEN_PROJECTBASEDIR" ] &&
221
+    MAVEN_PROJECTBASEDIR=`cygpath --path --windows "$MAVEN_PROJECTBASEDIR"`
222
+fi
223
+
222
 # Provide a "standardized" way to retrieve the CLI args that will
224
 # Provide a "standardized" way to retrieve the CLI args that will
223
 # work with both Windows and non-Windows executions.
225
 # work with both Windows and non-Windows executions.
224
 MAVEN_CMD_LINE_ARGS="$MAVEN_CONFIG $@"
226
 MAVEN_CMD_LINE_ARGS="$MAVEN_CONFIG $@"
226
 
228
 
227
 WRAPPER_LAUNCHER=org.apache.maven.wrapper.MavenWrapperMain
229
 WRAPPER_LAUNCHER=org.apache.maven.wrapper.MavenWrapperMain
228
 
230
 
231
+# avoid using MAVEN_CMD_LINE_ARGS below since that would loose parameter escaping in $@
229
 exec "$JAVACMD" \
232
 exec "$JAVACMD" \
230
   $MAVEN_OPTS \
233
   $MAVEN_OPTS \
231
   -classpath "$MAVEN_PROJECTBASEDIR/.mvn/wrapper/maven-wrapper.jar" \
234
   -classpath "$MAVEN_PROJECTBASEDIR/.mvn/wrapper/maven-wrapper.jar" \
232
   "-Dmaven.home=${M2_HOME}" "-Dmaven.multiModuleProjectDirectory=${MAVEN_PROJECTBASEDIR}" \
235
   "-Dmaven.home=${M2_HOME}" "-Dmaven.multiModuleProjectDirectory=${MAVEN_PROJECTBASEDIR}" \
233
-  ${WRAPPER_LAUNCHER} "$@"
236
+  ${WRAPPER_LAUNCHER} $MAVEN_CONFIG "$@"

+ 5
- 4
server/mvnw.cmd Vedi File

80
 
80
 
81
 :init
81
 :init
82
 
82
 
83
-set MAVEN_CMD_LINE_ARGS=%*
83
+set MAVEN_CMD_LINE_ARGS=%MAVEN_CONFIG% %*
84
 
84
 
85
 @REM Find the project base dir, i.e. the directory that contains the folder ".mvn".
85
 @REM Find the project base dir, i.e. the directory that contains the folder ".mvn".
86
 @REM Fallback to current working directory if not found.
86
 @REM Fallback to current working directory if not found.
118
 
118
 
119
 SET MAVEN_JAVA_EXE="%JAVA_HOME%\bin\java.exe"
119
 SET MAVEN_JAVA_EXE="%JAVA_HOME%\bin\java.exe"
120
 
120
 
121
-set WRAPPER_JAR="".\.mvn\wrapper\maven-wrapper.jar""
121
+set WRAPPER_JAR=""%MAVEN_PROJECTBASEDIR%\.mvn\wrapper\maven-wrapper.jar""
122
 set WRAPPER_LAUNCHER=org.apache.maven.wrapper.MavenWrapperMain
122
 set WRAPPER_LAUNCHER=org.apache.maven.wrapper.MavenWrapperMain
123
 
123
 
124
-%MAVEN_JAVA_EXE% %JVM_CONFIG_MAVEN_PROPS% %MAVEN_OPTS% %MAVEN_DEBUG_OPTS% -classpath %WRAPPER_JAR% "-Dmaven.multiModuleProjectDirectory=%MAVEN_PROJECTBASEDIR%" %WRAPPER_LAUNCHER% %MAVEN_CMD_LINE_ARGS%
124
+# avoid using MAVEN_CMD_LINE_ARGS below since that would loose parameter escaping in %*
125
+%MAVEN_JAVA_EXE% %JVM_CONFIG_MAVEN_PROPS% %MAVEN_OPTS% %MAVEN_DEBUG_OPTS% -classpath %WRAPPER_JAR% "-Dmaven.multiModuleProjectDirectory=%MAVEN_PROJECTBASEDIR%" %WRAPPER_LAUNCHER% %MAVEN_CONFIG% %*
125
 if ERRORLEVEL 1 goto error
126
 if ERRORLEVEL 1 goto error
126
 goto end
127
 goto end
127
 
128
 
142
 
143
 
143
 if "%MAVEN_TERMINATE_CMD%" == "on" exit %ERROR_CODE%
144
 if "%MAVEN_TERMINATE_CMD%" == "on" exit %ERROR_CODE%
144
 
145
 
145
-exit /B %ERROR_CODE%
146
+exit /B %ERROR_CODE%