Question

我的Laravel 5.3与Angular2网页有问题。这个问题突然来了。

这是错误：

Error: Error: XHR error (404 Not Found) loading http://tricolores.app/main
    at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://tricolores.app/zone.js/dist/zone.js:698:29)
    at ZoneDelegate.invokeTask (http://tricolores.app/zone.js/dist/zone.js:265:35)
    at Zone.runTask (http://tricolores.app/zone.js/dist/zone.js:154:47)
    at XMLHttpRequest.ZoneTask.invoke (http://tricolores.app/zone.js/dist/zone.js:335:33)
    Error loading http://tricolores.app/main

SystemJs.config.js：

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
    System.config({
        paths: {
            // paths serve as alias
            'npm:': 'node_modules/'
        },

        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: 'app',

            "rxjs": "node_modules/rxjs",
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

            // angular testing umd bundles
            '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
            '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
            '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
            '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
            '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
            '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
            '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
            '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            rxjs: {
                defaultExtension: 'js'
            },
            'angular2-in-memory-web-api': {
                main: './index.js',
                defaultExtension: 'js'
            }
        }
    });
})(this);

tsconfig：

"compilerOptions":{
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"mapRoot": "./",
"module": "es6",
"moduleResolution": "node",
"noEmitOnError": true,
"noImplicitAny": false,
"outDir": "../dist",
"sourceMap": true,
"target": "es6",
"typeRoots": [
"../node_modules/@types"
],
"types": [
"core-js"
]
}

我的包依赖性也没关系...我已正确导入所有依赖项。

第一页看起来像这样：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {{--<link rel="stylesheet" href="assets/css/style.light-blue-500.min.css" />--}}

    <title>Laravel 5.3 - Angular 2</title>

    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    {{ Html::script('core-js/client/shim.min.js') }}
    {{ Html::script('zone.js/dist/zone.js') }}
    {{ Html::script('reflect-metadata/Reflect.js') }}
    {{ Html::script('systemjs/dist/system.src.js') }}
    {{ Html::script('systemjs.config.js') }}

    <script>
        System.import('main').catch(function (err) { console.error(err); });
    </script>
</head>
<!-- 3. Display the application -->
<body>
<my-app>Loading...</my-app>
</body>
</html>

第一页：

welcome.blade.php

通过启动应用程序，将调用以下路径。

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

感谢您的帮助：）

Answer 1

问题是您正在呼叫＆＃39; https://stackoverflow.com/questions/43394074/conflict-between-jquery-and-google-maps-api＆＃39;但你的laravel后端没有路由。您拥有的唯一途径（我们可以看到）是根或{＆＃39; http://tricolores.app/main＆＃39;

Error: Error: XHR error (404 Not Found) loading http://tricolores.app/main
    at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://tricolores.app/zone.js/dist/zone.js:698:29)
    at ZoneDelegate.invokeTask (http://tricolores.app/zone.js/dist/zone.js:265:35)
    at Zone.runTask (http://tricolores.app/zone.js/dist/zone.js:154:47)
    at XMLHttpRequest.ZoneTask.invoke (http://tricolores.app/zone.js/dist/zone.js:335:33)
    Error loading http://tricolores.app/main

laravel路线现在

Route::get('/', function () {
      return view('welcome');
    });

添加下一条路线＆amp;编辑文件路径

Route::get('/main', function() {
  //PDF file that is stored under project/public/download/info.pdf
  $file= public_path(). "/download/info.pdf";

  $headers = array(
            'Content-Type: application/pdf',
          );

  return Response::download($file, 'filename.pdf', $headers);
}

http://tricolores.app

带有Angular2错误的Laravel 5.3：XHR错误（未找到404）

1 个答案: