EEParker / aspnetcore-vueclimiddleware

Helpers for building single-page applications on ASP.NET MVC Core using Vue Cli or Quasar Cli.
Other
339 stars 65 forks source link

publish in IIS with Development Variable #79

Open Kingside88 opened 4 years ago

Kingside88 commented 4 years ago

I try many days to publish my application to IIS but get everytime this error:

"InvalidOperationException: The SPA default page middleware could not return the default page '/index.html' because it was not found, and no other middleware handled the request."

Here is my startup.cs: endpoints.MapToVueCliProxy( pattern: "en/{*path}", options: new SpaOptions { SourcePath = "ClientApp" }, npmScript: (System.Diagnostics.Debugger.IsAttached) ? "serve" : null, port: 8080, https: true, runner: ScriptRunnerType.Npm, regex: "Compiled successfully", forceKill: true //wsl: false );

TobbenTM commented 4 years ago

In your Startup.cs you say only to run the Vue development server if the debugger is attached, are you actually attaching to the IIS process using Visual Studio?

Kingside88 commented 4 years ago

Oh man I think that was it. Thank you so much. Sometimes you have tomatos on you eyes :-D (German phrase) Now I have this error but I think I can solve it somehow: "Ensure that 'cmd' is installed and can be found in one of the PATH directories."...

Kingside88 commented 4 years ago

I really don't know what to do. After changing the folder to another place, I get the same error as in the start post. manuelly "npm run serve" works well. It starts the VueApp without any error. Also I tried to remove https and the https part from vueConfig. Then I get this error:

"System.Net.Http.HttpRequestException: 'Failed to proxy the request to http://127.0.0.1:8080/timeattendance, because the request to the proxy target failed. Check that the proxy target server is running and accepting requests to http://127.0.0.1:8080/." The ApplicationPool is running as "Administrator" Account. So no permission problems must be there. IIS Express in Visual Studio works also like a charme.

Did someone else get this working? I offer 20$ Amazon or PayPal if someone could help me. Maybe through Remote Session? Than I could also write a little step-by-step tutorial to achieve these.

TobbenTM commented 4 years ago

Could you paste the log output from the ASP.Net app? It should be forwarding any logs from the Vue server, and I'm curious to see if it's actually starting up, and on what port.

Kingside88 commented 4 years ago

Stdout Log seems to produce the best log file.

Stdlog out: https://pastebin.com/fytxZSxz Inner Exception: https://pastebin.com/LTvRCS0Q Startup.cs: https://pastebin.com/LEXhJvvb vue.config.js: https://pastebin.com/qJ9D1Gfu web.config: https://pastebin.com/KDCMyvZ2

The VueApp itself run on port 8080. I can open the app under following url "https://localhost:8080/en/ ". But this is the vueApp Url

VueApp is new created without modification. Just added vue.config.js and certifications in certs folder with mkcert. With IIS Express it runs well but make troubles with pure IIS. In IIS the AppPool runs with "Administrator" Identity. And https with "IIS Express Development Certificate"

Kingside88 commented 3 years ago

Its very quiete here. Does nobody else has this problems? How do you publish youre app in IIS?

JohnCampionJr commented 3 years ago

I'm not real clear on why you'd want to proxy this in production? Just let IIS serve the built, distributable Vue app with the Core app.

Proxying is intended mainly for debugging so you can do things like Hot Reload.

BinaryConstruct commented 3 years ago

The only other reason I can think of is for SSR. However, this library is not built or tested for any sort of security for a production deployment. This module is built and developed for use as a debugging and hot module reload assistant as @JohnCampionJr indicated.

If the problem is with getting the DIST folder content built, I would suggest starting with the sample projects in this repo and see if you can deploy those to IIS. If you use dotnet publish they should generate the appropriate files.

Kingside88 commented 3 years ago

Hi and thank you for your response. So the reason why I like to publish my ASP .NET Web Application with Vue is because the VueApp make Http Requests to my ASP Application. While developing the Frontend in Vue, I dont need to run the whole Asp Application in Visual Studio Debug mode.

But I solved the problem. If anyone else has the same requirements, he can do the follow:

  1. Install mkcert -> https://mkcert.org/
  2. open cmd and navigate to the folder where you want to generate a certification file (cd C:\Temp for example)
  3. type in the console window: mkcert -pkcs12 localhost 127.0.0.1
  4. now you created an "localhost+1.p12" file. Just rename it to "localhost.pfx"
  5. type in the console window: mkcert -install and agree with Yes or Ok
  6. double click to the file "localhost.pfx". Choose "Locale Computer". In the password field write changeit. Make the key exportable if needed.
  7. Now go to IIS where youre IIS Application is configured, choose "Bindings", choose your https Binding (or create one) and choose the installed certificate.
  8. In your Vue App, go to VueConfig.json the follow: `const fs = require('fs')

module.exports = { configureWebpack: { devtool: 'source-map' }, transpileDependencies: ["vuetify"], publicPath: '/PathFromVueCliMiddlewareForMyVueApp/', devServer: { // Serve index.html as the base XXX //contentBase: resolveAppPath('public'),

// Enable compression
compress: true,

// Enable hot reloading
hot: true,
hotOnly: true,
port: 8080,
https: true,
pfx: fs.readFileSync('../certs/localhost.pfx'),
pfxPassphrase: "changeit",
// public: 'https://xxxxxx:9000/',      

} };`

fdrobidoux commented 3 years ago

@Kingside88 How did you fix the Failed to start CMD error ? That's where I'm at.